GoogleフォームをWebサイトに埋め込む方法とその手順

Webサイトに回答フォームを埋め込みたいけれど、埋め込み方法が難しく分かりにくいと感じている方も多いのではないでしょうか。

そんな時にはGoogleフォームを利用するのがおすすめです。

Googleフォームは管理画面から簡単な操作でフォームを作ることができ、作成したフォームは簡易的な操作のみでWebサイトに埋め込むことが可能です。

今回はGoogleフォームをWebサイトに埋め込む方法とその手順についてご紹介します。

Googleフォームの埋め込み方法

Googleフォームをウェブサイトに埋め込む方法は、リンクで埋め込む、HTMLコードで埋め込む、Gmailに埋め込むといった3種類あります。

それぞれの方法をおこなう手順についてご紹介します。

方法①Googleフォームをリンクで埋め込む

Googleフォームをリンクで埋め込む際の手順は以下の通りです。

1.ホームページやブログに埋め込みたいGoogleフォームを開く

2.右上の「送信」をクリックする

3.「フォームを送信」から真ん中のリンクマークをクリックする

4.リンクが表示されたら「コピー」をクリックする
この時、左下の「URLを短縮」にチェックを入れると、URLを短縮することができるため、文字数制限等がある場合は、チェックを入れてください。

5.コピーしたURLをフォームを埋め込みたいWebページに貼り付ける

6.動作確認テストをおこなう
リンクの埋め込みが完了したら、動作確認のためにテストをおこなうようにしましょう。

テストでは、以下の2点をしっかりと確認しておきましょう。
・リンクをクリックするとGoogleフォームが正しく立ち上がるか
・埋め込んだフォームを入力したら、Googleフォームの「回答」欄に回答内容が反映されるか

方法②GoogleフォームをHTMLコードで埋め込む

GoogleフォームをHTMLコードで埋め込む手順についてご紹介します。

1.ホームページやブログに埋め込みたいGoogleフォームを開く

2.右上の「送信」をクリックする

3.「フォームの送信」からHTMLアイコンをクリックする

4.右下の「コピー」をクリックする
左の「幅」や「高さ」に数字を入力すると、サイズの調整ができるようになっています。
埋め込みたいサイトに合わせて数字を決めてください。

5.サイズ調整が終わったらコピーしたHTMLコードをフォームを埋め込みたいWebページに貼り付ける

6.動作確認テストをする
HTMLコードの埋め込みが完了したら、動作確認のためにテストをおこなうようにしましょう。

方法③GoogleフォームをGmailに埋め込む

GoogleフォームをGmailに埋め込む手順についてご紹介します。

1.ホームページやブログに埋め込みたいGoogleフォームを開く

2.右上の「送信」をクリックする

3.必要事項を入力し「フォームをメールに含める」にチェックを入れ「送信」をクリックする

4.送られたメールにGoogleフォームが含まれているかを確認する

【応用】WordPressにGoogleフォームを埋め込む方法

WordPressとは、サイトの作成やブログの作成をすることができるCMS（コンテンツ管理システム）の一つで、無料のソフトウェアです。

簡易的な操作でサイトやブログが作れるようになっているため、Googleフォームの埋め込みも簡単におこなうことが可能です。

WordPressにGoogleフォームを埋め込む方法を、リンクでの埋め込みとHTMLコードでの埋め込みの2種類に分けてご紹介します。

リンクで埋め込む方法

Googleフォームのリンクを使用してWordPressに埋め込む手順は以下の通りです。

1.ホームページやブログに埋め込みたいGoogleフォームを開く

2.右上の「送信」をクリックする

3.「フォームを送信」から真ん中のリンクマークをクリックする

4.リンクが表示されたら「コピー」をクリックする
この時、左下の「URLを短縮」にチェックを入れると、URLを短縮することができるため、文字数制限等がある場合は、チェックを入れてください。

5.WordPressを開き埋め込みたいページのリンクアイコンをクリックする

6.赤い枠の部分にリンクを挿入し、矢印をクリックする

すると下記画像のようにリンクが青く反応します。

7.プレビューをクリックしてフォームが埋め込まれているか確認をする
プレビューを確認後、問題が無かったら「公開」ボタンをクリックしてください。

HTMLコードで埋め込む方法

GoogleフォームのHTMLコードを使用してWordPressに埋め込む方法についてご紹介します。

1.ホームページやブログに埋め込みたいGoogleフォームを開く

2.右上の「送信」をクリックする

3.「フォームの送信」からHTMLアイコンをクリックする

4.右下の「コピー」をクリックする
左の「幅」や「高さ」に数字を入力すると、サイズの調整ができるようになっています。
埋め込みたいサイトに合わせて数字を決めてください。

5.WordPressを開き埋め込みたいページのテキストエディタ―をクリックする

6.コピーしたHTMLコードを貼り付ける

7.プレビューをクリックしてコードが埋め込まれているか確認する

プレビューを確認後、問題が無かったら「公開」ボタンをクリックしてください。

WordPressにGoogleフォームを埋め込むメリット・デメリット

WordPressにGoogleフォームを埋め込むメリットとデメリットについてご紹介します。

WordPressにGoogleフォームを埋め込むメリット

フォームを作成する際、WordPressにGoogleフォームを埋め込む方法で作成するメリットについてご紹介します。

設置が簡単

Googleフォームを利用すると、フォームを簡単にWordPressサイトに設置することができるといったメリットがあります。

Googleフォーム以外の場合は、埋め込むための操作が難しくなりますが、Googleフォームの場合はリンクやHTMLコードをコピーし、そのまま埋め込むだけでよいため操作がほとんど必要ありません。

例えば、キャンペーン時にフォームを埋め込む場合、費用をかけてフォームを作成しても、キャンペーンが終わると利用しないというケースも多いです。

そんな時には、コストをかけずに短時間で簡単にフォームの設置ができるGoogleフォームが最適でしょう。

ファイル添付が可能

Googleフォームにはファイルを添付することが可能です。
そのため、フォーム作成者が回答者にファイルを収集してもらう事や、回答者から添付ファイルの収集が可能です。

写真や履歴書などのPDFを送ってもらえるため、応募フォームや採用フォーム等に利用することもできます。

ファイルを添付する場合のファイルサイズは、1MB、10MB、100MB、1GB、10GBから選択をすることができるため、様々な種類のファイルを添付することができるでしょう。

ただし、ファイル添付機能を用いる際には、アンケート回答時にログインが求められるため、ユーザーはGoogleアカウントを所持している必要があることを知っておきましょう。

メール通知が可能

Googleフォームにはメール通知機能が搭載されています。
メール通知機能とは、Googleフォーム回答者がフォームに回答をすると、フォームの作成者に回答された旨がメールで通知される機能です。

この機能によりフォーム作成者は回答の状況をリアルタイムに把握することが可能です。

また、Googleフォームに搭載されているメール通知機能の場合は、フォーム作成者のみの通知になりますが、GASと呼ばれるGoogle Apps Scriptを使用することで複数人へのメール通知が可能になります。

チームでGoogleフォームを管理する場合などにとても便利な方法です。

Googleフォームのメール通知機能やGAS（Google Apps Script）のメール通知機能の使い方についてはこちらの記事で詳しくご紹介しています。
▶【画像で解説】Googleフォームのメール通知機能の使用方法

Googleサービスと連携しやすい

Googleが提供しているGoogleフォームだからこそ、Googleの他サービスとの連携がしやすい点も大きなメリットです。

特にGoogleスプレッドシートとGoogleドライブと簡単に連携できるのは大きなポイントです。

GoogleスプレッドシートにGoogleフォームに入力された回答を蓄積することができ、保存したドライブをチームで共有することができるため、ファイルでやり取りをする必要がなく、状況把握を簡単にすることが可能です。

こちらの記事ではGoogleスプレッドシートの共有について詳しく解説しています。
▶ Googleスプレッドシートの共有方法！権限変更や共有解除も解説

プラグインを使用してカスタマイズができる

WordPressのプラグインを用いることで、Googleフォームをより便利にすることができます。

WordPressのプラグインはプログラミング等の専門技術や知識が無くても簡単に導入することができ、シンプルなフォームやオリジナリティの高いフォームまで、自由にカスタマイズすることが可能です。

また、プラグインの中には顧客への自動返信機能や顧客情報の管理機能など多数あるため、目的に合ったツールを選ぶことができるのもメリットの一つでしょう。

>WordPressにGoogleフォームを埋め込むデメリット

フォームを作成する際、WordPressにGoogleフォームを埋め込む方法で作成するデメリットについてご紹介します。

ユーザーにはGoogleアカウントが必要

1つ目のデメリットとして、Googleフォームを入力する回答者にGoogleアカウントが必要になることが挙げられます。

回答する際にGoogleアカウントでのログインが必要になる場合、アカウントを所持していない人からの回答が得られないため回答率の低下に繋がる恐れがあります。

Googleフォーム作成時に、「回答を1回にする」という項目にチェックをしてしまうと回答する際にログインを求められてしまうため、設定時にチェックを外すようにしておきましょう。

回答の設定をはじめ、Googleフォームの詳しい使い方についてはこちらの記事でご紹介しています。
▶Googleフォームの使い方|プロ仕様のアンケートを作れる

デザインからGoogleフォームと一目で分かってしまう

Googleフォームを使用すると、分かりやすいデザインからGoogleフォームで作成したフォームだと一目で分かってしまう点もデメリットです。

Googleフォームを用いる場合、サイト全体富み比べてデザインの統一感が欠けてしまうことから、違和感を感じる方も多いです。

また、セキュリティの観点からGoogleフォームを信用していないユーザーからは回答が得られないなど、回答率が下がってしまうケースもあります。

セキュリティに不安がある

Googleフォームのセキュリティに不安があると感じる方が多いことは否めません。

管理アカウントの情報が漏れてしまった場合、氏名や住所、電話番号などの個人情報も合わせて流出する可能性があります。

またフォームの設定で誰とでも共有状況にある場合は、不特定多数の方に情報が流出してしまう恐れもあります。

通信にはSSLやTLSという暗号通信が使われており、Googleが提供する全てのサービスは24時間体制で監視されているので安心ではありますが、セキュリティに対して不安がある方はGoogleフォームの利用を避けるのもひとつの手段です。

Googleフォームがおこなっているセキュリティ対策についてはこちらの記事で詳しく解説しています。
▶Googleフォームのセキュリティ対策は必要？知っておきたいセキュリティ対策

デザインのカスタマイズが難しい

Googleフォームではデザインのカスタマイズをすることが難しいという特徴があります。

オリジナリティを出したい場合でも、ヘッダー画像しか変更することが出来ないため、デザインの変更をしたい方には大きなデメリットになり得るでしょう。

埋め込んだGoogleフォームが表示されない時は権限を確認

埋め込んだGoogleフォームが表示されなかったり、開かないという場合は権限が付与されていない場合があります。

権限を変更する手順についてご紹介します。

1.権限を変更したいGoogleフォームを立ち上げ、右上の「︙」をクリックする

2.「共同編集者を追加」をクリックする

3.「制限付き」から「リンクを知っている全員」または「組織」をクリックする

これで権限の変更完了です。

まとめ

Googleフォームの埋め込み方法は、リンクで埋め込む、HTMLコードで埋め込む、Gmailで埋め込む方法があります。

どの方法も簡単な操作で埋め込むことが可能ですが、埋め込みが完了した後は、正しく埋め込まれているか、正しく動くかどうか動作確認をおこなうようにしましょう。

目的に合わせた埋め込み方法で、Googleフォームの埋め込みを活用してみてください。

その他、同じような話題で以下も取り上げていますので、よろしければご覧ください。

【初心者必見】Googleスライドの基本的な使い方やパワーポイントの違い

GoogleスライドはGoogleドライブのサービスの１つとして、Google社が無料で提供するプレゼンテーションツールです。プレゼンテーション用のテーマを複数揃えており、豊富なアニメーションや、埋め込み動画などを活用して、自由な資料を作成できます。

実務に役立つGoogleドキュメントの使い方講座

Googleドキュメントは、Googleが提供する無料の文書作成ソフトで、Googleアカウンさえあれば誰でも使用できます。Googleドキュメントの基本的な使い方から実務に欠かせない機能や使い方まで幅広く解説します。

【初心者向け】Googleスプレッドシートの基本的な使い方とエクセルとの違い

GoogleスプレッドシートはGoogleが無料で提供する表計算ツールです。マイクロソフトのエクセル同等の機能が盛り込まれており、効率的に作業を進めることができます。この記事では初心者向けにGoogleスプレッドシートの使い方を解説します。

<a href="https://digitor.jp/textbook/googleforms-embedding/">GoogleフォームをWebサイトに埋め込む方法とその手順</a>