おすすめ記事ピックアップ
待望のBloggerウィジェット(ガジェット)「連絡フォーム」が登場しました。個人的には、待望の機能です。でもウィジェットとしてしか使えないので、今のところは利用しません。こちらの問い合わせフォーム(http://www.furimuke.com/2013/04/bloggerblogmail.html)の方が便利なので。
詳しくはクリボウさんの記事参照しかしながら、今後は利用してゆきたい「連絡フォーム」です。どんどん改良もされていくことでしょう。テストで入れてみたら、サイドに固定するようなデザインを採用しているためか、横幅の調整ができなくなっています。外部のBlogger側のcssで、サイズ等を指定しているため、HTMLを編集しても調整できないのです。
Blogger に「連絡フォーム」ガジェットが新登場
http://www.kuribo.info/2013/05/blogger-contact-form-gadget.html
フォームのテキストエリアを調整したいのに。。。涙という人向けにちょっと、強制的に修正する追加のCSSを作成してみました。たぶん正規CSS的には、あまり良くないのかもしれません。またもっとよい方法もあるはずです。そしてすぐ使えなくなるかもしれません。
下記コードをcssに追加してください。フォームの周りのスペースや、テキスト入力エリアのサイズ調整は、数字を変えておこなってください。
/*------------------------------------------------------ ContactForm css ------------------------------------------------------*/ #ContactForm1 { padding: 10px 10px 10px 20px; } .contact-form-widget { max-width: 550px; !important; width: 100%; } .contact-form-name, .contact-form-email, .contact-form-email-message { max-width: 550px; !important; }簡単に説明すると、まず#ContactForm1で、フォーム周りのスペースを調整できます。paddingは上右下左の順で数字がならんでいるのは、もはや常識ですね。もっと省略した書き方もありますけども。開けたいスペースの大きさで、数字を変更してください。
次の max-width が2箇所あります。フォームエリアを広げたい大きさに数字を調整してください。同じサイズ(550pxであれば2箇所とも550px)で良いと思います。
こんな感じにフォームのテキストエリアのサイズが調整できました。