Googleフォームの埋め込み方法と手順を解説！

更新：2026/05/11 13:54

ビジネススキル

Googleフォームで回答を集めるには、リンク共有やWebサイトへのフォームの埋め込みなどの方法があります。特にWebサイトへの埋め込みは、フォームへの迅速なアクセスが可能で、ユーザーの離脱を防ぎ回答率の向上が見込める手段です。

本記事では、Googleフォームの埋め込み方法を詳しく解説するとともに、Webサイトへの埋め込みのメリットや活用シーンも紹介します。フォームを設置する目的に応じて、最適な共有方法を検討し、効果的なフォーム運用を実現しましょう。

Googleフォームとの違いが気になる方へ
カスタマーサポートツール「Tayori」は、フォーム・FAQ・アンケートを一つの管理画面で運用できるツールです。機能や料金の詳細は、まず資料でご確認ください。

【目次】

GoogleフォームをWebサイトに埋め込む目的と活用例
Googleフォーム埋め込みの4つの方法・手順
【要注意】Googleフォーム埋め込みのデメリット（デザインの限界）
自社サイトのデザインに馴染むフォームを埋め込むなら「Tayori」
まとめ

GoogleフォームをWebサイトに埋め込む目的と活用例

GoogleフォームをWebサイトに埋め込む主な目的は2つあります。

1つ目は「回答へのハードルを下げること」です。フォームを埋め込むことで、回答者は別ページへ移動することなく、その場で回答を完結できます。移動の手間がなくなるため、より多くの回答が期待できます。

2つ目は「デザインの統一」です。Webデザインに合わせてフォームをカスタマイズすることで、サイト内で違和感なくフォームを提供しようとする試みです。

具体的な活用例として、以下のようなものがあります。

・アンケート
・イベントの申し込み
・問い合わせ窓口
・資料請求

WebにGoogleフォームを埋め込むことで、ユーザーとのスムーズなコミュニケーションと効率的なデータ収集が可能となるでしょう。

Googleフォーム埋め込みの4つの方法・手順

Googleフォームをプラットフォームに埋め込む方法は複数あります。ここでは、既存の代表的な4つの方法とそれぞれの手順を詳しく解説します。

方法1：iframeで埋め込む

Googleフォームの埋め込みコードを発行し、WebページのHTMLコードに埋め込む方法です。ウェブサイトやブログ、社内ポータルなどで広く活用されます。

Step1：Googleフォームを作成する

新規フォームを作成するか、既存のフォームを開き、必要な質問項目を追加してフォームを完成させます。

Step2：埋め込みコードを取得する

フォームの編集画面右上にある「⋮」をクリックし、「HTMLを埋め込む」を選択。iframeタグで記述された埋め込みコードが表示されます。必要に応じて幅（width）と高さ（height）を調整してください。デフォルト値は幅640px、高さ480pxに設定されています。設定が終わったら、埋め込みコード全体をコピーしましょう。

<iframe
src="YOUR_GOOGLE_FORM_URL_HERE"
width="640"
height="480"
frameborder="0"
marginheight="0"
marginwidth="0"
>
読み込んでいます…
</iframe>

Step3：サイトに埋め込む

WebサイトのHTMLファイルを開き、表示したい位置にコードを貼り付けます。モバイル端末で正しく表示させるには、幅を「100%」に設定することで、親要素に合わせてサイズを自動調整できます。

<iframe
src="YOUR_GOOGLE_FORM_URL_HERE"
width="100%" <!-- 幅を親要素の100%に設定 -->
height="480" <!-- 高さは必要に応じて調整してください。または後述のCSSでアスペクト比を保つ方法もおすすめします。 -->
frameborder="0"
marginheight="0"
marginwidth="0"
>
読み込んでいます…
</iframe>

注意： ファイルや画像のアップロードを求める質問項目が含まれている場合、埋め込みコードを発行できません。その場合はリンク共有などを検討してください。

方法2：リンクとして埋めこむ

GoogleフォームのURLをコピーして、Web上のテキストやボタンにリンクとして設定する方法です。Webのデザインを損なうことなく、シンプルにフォームへの導線を確保できます。メールマガジンやSNS投稿、ウェブサイトのバナー広告などフォームそのものを表示するスペースがないプラットフォームから、フォームへ遷移させたい場合に最適です。「詳しくはこちら」「アンケートに回答する」といった文言と組み合わせることで、ユーザーの行動を効果的に促せます。

ただし、リンクをクリックする場合、回答者はプラットフォームから離れてGoogleフォームのページに移動しなくてはなりません。回答までのステップ数が若干増えるのが難点です。

Step1：リンク設定するテキストを選択

HTML上で「詳細はこちら」などのリンクにするテキストを用意します。

Step2：リンクを設定する

Googleフォームの「送信」画面からリンクアイコンを選びURLを取得します。

次に、テキストを <a> タグで囲み、 href 属性にURLを指定します。

<a href="リンク先のURL">リンクを設定するテキスト</a>

Step3：HTMLを保存・反映

ファイルを保存して反映させると、テキストリンクが有効になります。

方法3：Eメールに埋めこむ

Googleアカウントに登録しているメールアドレス宛であれば、GoogleフォームをEメールに表示させることができます。受信者はメールを開いてすぐにフォームへアクセスできるので、回答までのステップが少なくなり回答率の向上に繋がります。

Step1：Googleフォームを開く

共有したいGoogleフォームを開きます。

Step2：フォームの共有画面を開く

次に、フォーム編集画面の右上にある「公開」をクリックすると、オプション画面が開きます。その画面の回答者の欄に表示されている「管理」をクリックして「フォームの共有」画面を開きます。

Step3：メール設定

「メール」タブを選択し、宛先を入力。「メールにフォームを含める」にチェックを入れて送信します。受信者はメールを開いてすぐに回答できるため、回答率の向上が期待できます。

方法4：プラットフォーム特有の機能で埋め込む

「WordPress」「Googleサイト」など一部のプラットフォームでは、Googleフォームを埋め込むための機能を提供しています。プラットフォームによりますが、専門知識がなくてもコピー&ペーストでフォームを表示できるケースが多くみられます。ブログやホームページ作成ツールなど特定のプラットフォームを利用している場合は、Googleフォームを埋め込むための機能があるかを調べてみましょう。

【WordPressの場合】Step1：Googleフォームの埋め込み用コードを取得

まず、埋め込みたいGoogleフォームの埋め込み用HTMLコードを取得します。

【WordPressの場合】Step2：投稿または固定ページを編集

WordPressの管理画面で、フォームを設置したい投稿または固定ページを開いて編集モードに入ります。

【WordPressの場合】Step3：「カスタムHTML」ブロックを追加してURLを貼り付け

ブロックエディターの「＋」ボタンをクリックして「カスタムHTML」ブロックを追加し、ステップ1でコピーした埋め込み用HTMLコードを貼り付けます。プレビューで正しくフォームが表示されているか必ず確認してください。クラシックエディターを利用している場合は、編集画面に埋め込みコードを直接貼り付ける方法が一般的です。

【Googleサイトの場合】Step1：Googleフォームを作成

Googleサイトで使用するフォームを新規作成するか、既存のフォームから選択します。

【Googleサイトの場合】Step2：サイトの編集画面を開く

Googleサイトの編集画面にアクセスします。

【Googleサイトの場合】Step3：「挿入」から「フォーム」を選択して追加

画面右側の「挿入」メニューから「フォーム」を選択します。表示されるリストから目的のフォームを選び、「挿入」をクリックすれば完了です。これでサイト上にフォームが表示されます。

【要注意】Googleフォーム埋め込みのデメリット（デザインの限界）

iframeなどで手軽に埋め込めるGoogleフォームですが、自社サイトへの設置においては、デザインのカスタマイズ性が低いという課題があります。

Googleフォームは特有のレイアウトや配色が固定されており、自社のブランドフォントやカラー、サイトのトーン＆マナーに細かく合わせることができません。そのため、埋め込んだ箇所が「いかにもGoogleフォーム」という無機質な印象になり、サイト全体の雰囲気から浮いてしまうことがあります。

特に顧客向けの問い合わせ窓口として利用する場合、デザインの違和感はユーザーに「簡易的なツールを使っている」という印象を与え、信頼性やブランド体験を損ねてしまうリスクがあります。

「ブランドに馴染むフォームを設置したい」方へ
実際にフォームや問い合わせ管理を改善した企業の事例や、カスタマーサポート体制の構築に役立つガイドラインを含む資料3点を無料でご用意しています。自社に合ったツール選びの参考にぜひご活用ください。

自社サイトのデザインに馴染むフォームを埋め込むなら「Tayori」

「サイトのデザインを崩したくない」「より信頼感のある窓口を設置したい」という場合には、カスタマーサポートツール「Tayori」がおすすめです。

サイトに溶け込むデザイン

コーポレートカラーに合わせて色やボタンを自由に調整できるため、ブランドイメージを損なわない美しいフォームを埋め込めます。

ウィジェット形式での設置

専用のJavaScriptコードを1行貼り付けると、サイトの画面端にお問い合わせボタンを常駐させる『ウィジェット設置』が可能です。ページを移動せずにその場でフォームが立ち上がるため、ユーザーの離脱を防ぎ、高い回答率を維持できます。

参考：Tayoriを活用して、お問い合わせフォームをHTML形式で設置する方法

管理の効率化

Tayoriは、フォームから届いたお問い合わせを「未対応」「保留」「完了」といったステータスで管理できるため、メールソフトでの管理にありがちな「誰がどこまで対応したかわからない」というミスや対応漏れを防げます。

また、よくある質問をまとめた「FAQ（よくある質問）」ページと連携させることで、ユーザーが問い合わせをする前に自己解決を促し、窓口の負荷を軽減することも可能です。アンケート機能も同一の管理画面で運用できるため、顧客の声（VOC）を収集・分析し、サービスの改善へスピーディーに繋げる体制を最小限の工数で構築できます。

プロフェッショナルな顧客対応窓口を簡単に構築したい方は、ぜひ資料をご確認ください。