WordPressのお問い合わせをGoogleフォームで作成する方法

WordPressのお問い合わせフォーム

サイトを作成したけど、お問い合わせフォームも設置した方がよさそうだ。
だけど、初心者でも早く簡単につくれる方法はないかな?

この記事では、プラグインが不要で、初心者でも簡単につくれる、
Googleフォームを使ったお問い合わせフォームの設置方法を紹介しています。

[st-mybox title=”ポイント” fontawesome=”fa-check-circle” color=”#00487f” bordercolor=”#00487f” bgcolor=”#ffffff” borderwidth=”2″ borderradius=”5″ titleweight=”bold”]

一般的には、ContactForm7というプラグインを使用する方法が多いですが、初心者向けかつ3分で作成可能という点で、Googleフォームを紹介しています。

[/st-mybox]

目次

GoogleフォームとContactForm7の違いについて

お問い合わせフォームの作成に、Googleフォームを使用する理由について紹介します。

[st-mybox title=”Googleフォームのメリット” fontawesome=”fa-file-text-o” color=”#757575″ bordercolor=”#f3f3f3″ bgcolor=”” borderwidth=”3″ borderradius=”5″ titleweight=”bold” title_bordercolor=”#757575″ fontsize=”” myclass=”st-mybox-class st-title-under st-list-no st-list-border” margin=”25px 0 25px 0″]

  • プラグインが不要:サーバーへの負荷が軽減
  • 簡単にカスタマイズできる
  • ContactForm7より設定手順がシンプル

[/st-mybox]

プラグインの設定自体は、慣れればそれほど難しいものではありませんが、
Googleフォームの方が、初心者でもカスタマイズしやすい仕様になっています。

また、プラグインを使わない分、WordPressの負荷も少なくなるので、
ページの表示速度を下げにくいというメリットもあります。

当サイトでは、GoogleフォームとContactForm7のどちらも利用していたので、
どのような違いがあるのか画像で紹介します。

Googleフォームで作ったお問い合わせ

当サイトでも使用しているGoogleフォームを使ったお問い合わせフォームがこちらです。

Googleフォームで作ったお問い合わせフォーム

[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”#dcdcdc” bgcolor=”” borderwidth=”2″ borderradius=”5″ titleweight=”bold” fontsize=”” myclass=”st-mybox-class” margin=”25px 0 25px 0″]

  • 項目が自由に追加できる
  • 記述式や選択式などの回答方式も選べる
  • フォームの色やデザインなどが選べるのでカスタマイズ性が高い

[/st-mybox]

Googleフォームではこうしたメリットがあり、デザイン性の自由度も高く、自分のサイトにあったお問い合わせフォームが作れます。

ContactForm7で作ったお問い合わせフォーム

一方で、ContactForm7のプラグインを使用したお問い合わせフォームはこちら。

ContactForm7で作成したお問い合わせフォーム

ContactForm7で作成した方が、デザインがしっかりしている印象を受けますが、
実際のところ、お問い合わせフォームを利用する人はほとんどいないので、少し考えてしまいます。

しかし、どうしてもContactForm7でお問い合わせフォームを作成したい!という人は、
バズ部さんのこちらの記事【簡単】Contact Form 7の効果的なカスタム方法が参考になります。

設置さえできれば、デザインは気にしない!という場合には、Googleフォームを利用するべきかな、と思います。

WordPressのお問い合わせをGoogleフォームで作成する手順

お問い合わせフォーム設置の流れは3ステップ。初心者でも3分ほどで設置が完了します。

[st-mybox title=”手順” fontawesome=”fa-list-ol” color=”#757575″ bordercolor=”#f3f3f3″ bgcolor=”” borderwidth=”3″ borderradius=”5″ titleweight=”bold” title_bordercolor=”#757575″ fontsize=”” myclass=”st-mybox-class st-title-under st-list-no st-list-border” margin=”25px 0 25px 0″]

  • Googleフォームでお問い合わせフォームを作成
  • WordPressで固定ページを作成
  • 作成した固定ページにHTMLを貼り付けて公開

[/st-mybox]

以下でそれぞれの手順に沿って解説していきます。

Googleフォームでお問い合わせを作成

Googleフォームの選択画面

まずはじめに、Googleフォームの公式サイトにアクセスします。
Googleアカウントでログイン後、左側(パーソナル)の「Googleフォームを使ってみる」のボタンを選択してください。

新しいフォームを作成

テンプレートが並んでいる画面に進みますが、左上の「空白」というボタンから、新しいフォームを作成します。

Googleフォームでは、お問い合わせフォームの作成以外にも、
アンケートや、イベントの出欠確認などのフォームとしても利用できる万能なサービスです。

入力フォームを追加する

こちらがお問い合わせフォームの原型になります。

Googleフォームの入力項目追加

初期状態では入力フォームが1つしかないのと、入力形式もラジオボタンになっているので、下記の項目を追加していきましょう。

[st-mybox title=”設定する項目” fontawesome=”fa-file-text-o” color=”#757575″ bordercolor=”#f3f3f3″ bgcolor=”” borderwidth=”3″ borderradius=”5″ titleweight=”bold” title_bordercolor=”#757575″ fontsize=”” myclass=”st-mybox-class st-title-under st-list-no st-list-border” margin=”25px 0 25px 0″]

  • お名前:記述式
  • メールアドレス:記述式
  • 題名:記述式
  • 本文:段落

[/st-mybox]

それぞれ右側の、丸いプラスボタンから追加できるので、
項目に合わせた入力方式を選択することによって、お問い合わせフォームが作成できます。

もちろんこれ以外にも、自身のサイトに合わせて項目を追加するのもよしです。

完成したお問い合わせフォーム

上記の項目を追加するとこのようになります。

Googleフォームの設定

右上のパレットのボタンから、デザインや色などが選べるので、自分のサイトにあった配色にしてみるといいかもしれません。

HTMLのコードをコピーする

GoogleフォームのHTML

最後に、右上の送信ボタンをクリックし、3種類の送信方法(メール、リンク、HTMLを埋め込む)のなかから、「HTMLを埋め込む」をクリックします。

そうすると、こちらの画面が表示されるはず。
こちらのHTMLのコードを全てコピーすれば、Googleフォームの設定は完了です。

WordPressの固定ページを作成する

WordPressの固定ページ

次にお問い合わせフォームを表示するページを作成します。
お問い合わせページは通常の「投稿」とは別で、「固定ページ」で作成します。

WordPressのエディターには「ビジュアル」と「テキスト」があると思いますが、
HTMLを貼り付ける際は、必ず「テキスト」の状態で編集するようにしましょう。

GoogleフォームのHTMLを埋め込むことができたら、あとは固定ページを公開して完了です。

お問い合わせフォームの設置位置

お問い合わせページを設置したものの、どの位置にリンクを設置すればいいのかわからない、という人もいるのではないでしょうか。

お問い合わせフォームのリンクを設置する位置は主に、

[st-mybox title=”設置する位置” fontawesome=”fa-check-circle” color=”#00487f” bordercolor=”#00487f” bgcolor=”#ffffff” borderwidth=”2″ borderradius=”5″ titleweight=”bold”]

  • ヘッダー内
  • フッター内
  • プロフィール枠内

[/st-mybox]

のいずれかが多いです。

当サイトでも、プロフィール欄の下にあるSNSアイコンと一緒に設置したり、
一番下のフッター内にも「お問い合わせ」という文言でリンクを貼っています。

お問い合わせを目立たせる必要はありませんが、

誰かが自分のサイトに連絡しようとしたとき、お問い合わせ先がどこにあるかわからない。
ということにならないように、基本的な位置に設置しておくことが重要です。

プラグインはなるべく少なくしよう

WordPressでは便利なプラグインがたくさんあるので、ついついプラグインを入れてしまいがちです。しかし、プラグインを導入しすぎると、サイトに負荷がかかってしまいページの表示速度も落ちてしまいます。

今回のお問い合わせフォームのように、なるべくプラグインを使わないで設定することが、SEOの視点からも重要です。

WordPressやサイトの設定では、他にも注意するべきポイントがありますので、よければ参考記事もチェックしてみてください。

目次
閉じる