Bloggerにお問い合わせフォームを設置

この度、当サイトに'連絡フォーム'ページを設置しました。その際、Bloggerにお問い合わせフォームを設置する方法について少し調べたことを、この投稿でまとめておきます。

コメント: 0

代表的な二つの方法

Bloggerにお問い合わせフォームを設置するには、主に二つの方法があるようです。Blogger純正の'連絡フォーム'ガジェットを利用する方法と、第三者のウェブ・フォーム・サービスを利用する方法です。

Blogger純正の'連絡フォーム'ガジェット

ガジェット追加画面

Bloggerにはこれまでお問い合わせフォームを設置する機能はありませんでした。しかし、今年の夏頃(?)にBloggerの純正の'連絡フォーム'なるガジェットが登場したようです。ガジェットということなので、サイドバーなど小さなスペースに設置し、全てのページに表示することとなります。

'連絡フォーム'ガジェット: サイトのデザインと調和します。

このような使い方で良い場合はこちらの選択肢で構わないと思います。何しろ設置が簡単ですし、設定項目がないので迷うことがありません。サイトのスタイルに溶け込みますし、デザインの調整もBloggerの管理画面から可能です。

蛇足かもしれませんが、テンプレートを編集することで、'お問い合わせフォーム'ページだけに'連絡フォーム'ガジェットを表示することは可能だと思います。実際には試したことがないのですが、下のコードのようにして、URLによってガジェットの表示を制御できるのではないでしょうか。

<b:if cond='data:blog.url == data:blog.homepageUrl + &quot;p/contact.html&quot;'>
'連絡フォーム'ガジェットのコード
</b:if>

第三者ウェブ・フォーム・サービスを利用

以前は上記のBlogger純正の'連絡フォーム'ガジェットはなかったことですし、多くのBlogger利用者は、第三者サービスを利用して、お問い合わせフォームを設置していたことと思います。現在でも、Blogger純正の'連絡フォーム'とは別の機能を求めるユーザーの多くは、第三者サービスを利用していると思います。

ウェブ・フォーム・サービス

ウェブ・フォーム・サービスとは？

ウェブ・フォーム・サービスという呼び方が一般的に通用する呼び方なのかはわかりませんが(笑)、とにかく、マウスでクリックしたり、ドラッグ&ドロップしたりすることで、誰でも簡単にウェブ・フォームを作成し、しかも自分のウェブサイトに設置できるサービスのことを言っているつもりです。

ウェブ・フォーム・サービス提供者

Google Docs(Google Forms?)、123Contactform、JotForm、Wufooを始め、無料で利用できるものだけでも数えきれないほどあります。私はよく知りませんが、恐らく日本のサービスもあると思いますので、興味のある方は探してみてください。

使用例

当サイトの連絡フォーム

今回私が注目したのは123ContactformとJotFormでした。始めにJotFormを試してみたところ、なかなか良さそうなので使用することに決めました。123Contactformはまだ使用したことがありません。現在、当サイトの'連絡フォーム'ページでJotFormで作成したフォームを使用しています。自分のサイトのデザインに合わせることが出来ますし、完全に日本語化することも出来ます。広告やJotFormへのリンクが表示されないのも良いですね。ページの読み込みに問題があることがありますが、概ね満足しています。使用例としてご覧になりたい方はどうぞ。メッセージを送信すると本当に私のEメールに届くので、テスト送信はご遠慮ください(笑)。

もちろんブロガー以外にも使用可能

投稿の題名は『Bloggerにお問い合わせフォームを設置』となっていますが、ウェブ・フォーム・サービスを利用する方法では、生成されるコードを自身のサイトのフォームを表示したい箇所に挿入するだけですので、Blogger以外にも、ほぼすべてのサイトに設置できます。

それぞれの長所と短所のまとめ

Blogger純正の'連絡フォーム'ガジェットの長所

• ガジェットの追加画面から簡単に設置可能。
• 他のガジェットと同様、Bloggerのテンプレートに自然に溶けこむ。
• 送信数の制限がない。

Blogger純正の'連絡フォーム'ガジェットの短所

• 名前、メール(入力必須)、メッセージ(入力必須)という三つのフィールドを変更することも、他のフィールドを追加することも不可能。
• CAPTCHAのようなスパム対策を設置できない。
• 'お問い合わせ'ページのようなものを設け、そのページでのみフォームを表示させることが出来ない。(上記の方法で可能かもしれませんが...。)

第三者ウェブ・フォーム・サービスを利用する方法の長所

• 自由にフィールドを作成できるものがほとんど。
• CAPTCHAのようなスパム対策を設置できるものがほとんど。
• 投稿の編集画面からコードを挿入し、通常記事が表示されるところにフォームを表示させることが可能。'お問い合わせ'ページのようなものを作成しやすい。

第三者ウェブ・フォーム・サービスを利用する方法の短所

• iframeでフォームを挿入するため、Bloggerのテンプレートのスタイルに溶け込まない。CSSを編集できるものもあるが、その分手間がかかる。
• Blogger純正の'連絡フォーム'ガジェットに比べれば、設定に手間がかかる。
• 無料版では月に100通までなど、送信数に制限があるものがほとんど。

次回の投稿では、JotFormを利用して、当サイトの'連絡フォーム'のような簡単なウェブ・フォームを作成する手順をご紹介したいと考えています。¹

---

1. 2013年12月14日更新: JotFormでお問い合わせフォームを作成して、自分のサイトに設置する手順例 ↩