(画像の高さ) (画像の幅) お問い合わせページを作ってみました | たけもものなんとなくな日々 たけもも

お問い合わせページを作ってみました

私的な備忘録ブログですが、お問い合わせページを作ってみました。

お問い合わせページを作る

参考にしたのはトーマスイッチさんのこの記事です。
Bloggerの連絡フォーム機能を使ってお問い合わせページを作る方法
Bloggerの長所は、何といっても「本当に無料ブログかよ」と突っ込みたくなるぐらい、充実した機能とカスタマイズ性にあります。
その高機能っぷりを示しているのが、「連絡フォーム」と言うコンタクトフォームを気軽にブログに設置できる、と言うことではないでしょうか?
自分でやってみたことの確認です。

お問い合わせページをサイドバーに作ってみる

サイドバーに入れてみました。その結果が下の画像です。
サイドバーに連絡フォームを入れてみた
かなりバランスの悪い配置になりました。

お問い合わせページをメインカラムで作ってみる

メインカラムに移してみました。
メインカラムにお問い合わせガジェットを入れて作る
バランスも良く、見た目もスッキリしたと思います。
赤線で囲ったバーはサイドバーのときにはありません。
これはメッセージ送信時、上のバーには送信失敗のエラーメッセージが、下のバーには送信に成功した場合のメッセージが表示されます。
失敗した場合のメッセージを確認しておりませんのでわかりませんが、送信に成功した場合は「メッセージの送信成功」といった内容が表示され、間もなく消えてしまいます。

送信ボタンの表記を変えてみる

トーマスイッチさんの方法そのままでは送信ボタンが「Send」になっています。このままでは何か落ち着かないので「送信」と表示されるようにしてみました。
 <input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Send'/>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='送信'/>
赤い文字のところを「send」から「送信」に変えるだけです。

ここに何か気の利いたメッセージがあればなお良いのでしょうが、しばらくはこのままになりそうです。

この記事の続き

お問い合わせページその2:お問い合わせページにメッセージを付けてみました
お問い合わせページその3:お問い合わせページに背景色を足しました

0 件のコメント :

コメントを投稿