Googleフォームのクイズをウェブサイトに埋め込むのは、驚くほど簡単です。教師が評価を作成する場合でも、トレーナーが知識チェックを構築する場合でも、HRマネージャーが従業員アンケートを設計する場合でも、このガイドでは必要なすべての手順を説明します。また、途中でいくつかの強力な代替案も探ります。
- リンクを共有する代わりにクイズを埋め込む理由
- Googleフォームのクイズをウェブサイトに埋め込むステップバイステップガイド
- OnlineExamMakerの紹介：AIを使用して埋め込み可能なクイズを作成
- クイズ埋め込みに関するよくある質問とトラブルシューティングのヒント
リンクを共有する代わりにクイズを埋め込む理由
正直に言いましょう—あなたのサイトから離れるリンクをクリックするのは、何となく違和感があります。流れを断ち切ってしまうからです。注意深くデザインしたウェブサイトが、突然Googleの汎用的なインターフェースに取って代わられ、気がつけば訪問者の半分がメールをチェックするためにどこかへ行ってしまった、という経験はありませんか。
埋め込みは、すべてを一か所に保ちます。あなたのクイズはサイトの体験の一部となり、後付けのようには感じられません。専門的に見え、シームレスに感じられ、最も重要なことに、訪問者をあなたが望む場所に引き留めておくことができます。
ユーザーの視点で考えてみてください。新しいタブを開く（あるいは最悪の場合、完全にリダイレクトされる）リンクをクリックするのと、既に読んでいるページをスクロールダウンして、クイズが待っているのを見つけるのと、どちらが良いでしょうか。答えは明らかです。
Googleフォームのクイズをウェブサイトに埋め込むステップバイステップガイド
Googleフォームから埋め込みコードを取得する
ここから魔法が始まりますが、朝のコーヒーを作るよりも簡単です。Googleフォームは、必要なものを全て銀の皿に載せて提供してくれます—どこを見ればいいか知っていればいいだけです。
ステップ1: クイズを開く
Googleフォームのクイズに移動します。右上隅にある送信ボタンが見えますか？それがあなたの入り口です。それをクリックすると、いくつかの共有オプションが表示されるウィンドウがポップアップします。
ステップ2: 埋め込みアイコンを見つける
右上隅の三点リーダーアイコンをクリックして、埋め込みコードボタンを取得します。これは埋め込みHTMLアイコンで、クリックすると、あなたのウェブサイトでクイズを実現するiframeコードが表示されます。
ステップ3: 寸法をカスタマイズする
ここで少し創造性を発揮できます。デフォルトの寸法はあなたのサイトに完璧に合わないかもしれません。クイズをコンテンツエリアの全幅に広げたいですか？幅の値を100%に変更します。クイズが縦に窮屈すぎると感じますか？高さを800または1000ピクセルに上げてみてください。
コードは次のようになります：
<iframe src="https://docs.google.com/forms/d/e/YOUR_FORM_ID/viewform?embedded=true" width="100%" height="800" frameborder="0">読み込み中…</iframe>ステップ4: コードをコピーする
寸法に満足したら、コードスニペット全体をコピーします。これで、これをウェブサイトに貼り付ける準備ができました。
異なるウェブサイトプラットフォームにクイズを追加する
異なるウェブサイトビルダーにはそれぞれ特徴がありますが、埋め込みに関してはすべて同じ言語、HTMLを理解します。最も人気のあるプラットフォームのプロセスを分解してみましょう。
WordPress：コンテンツ管理の重量級
WordPressはインターネットの大部分を支えていますが、その理由は正当です。クイズを埋め込む方法は次のとおりです：
クイズを表示させたいページまたは投稿を編集します。ブロックエディター（Gutenbergとも呼ばれる）で、新しいブロックを追加するためにプラスアイコンをクリックします。カスタムHTMLを検索して選択します。iframeコードを直接そのブロックに貼り付けます。公開を押せば完了です。
WordPressの美しさはその柔軟性にあります—カスタムHTMLブロックをコンテンツ内のどこにでも配置し、段落の間に挟んだり、専用のセクションを与えたりできます。
プレーンHTMLサイト：オールドスクールなアプローチ
生のHTMLを扱っていますか？これはあなたの領域です。お気に入りのコードエディタでHTMLファイルを開き、クイズを配置したい<body>セクション内の場所を見つけ、iframeコードを貼り付けます。ファイルを保存し、サーバーにアップロードすれば、準備完了です。
この方法の直接性には満足感があります。プラグインもインターフェースもありません—ただあなたとコードだけです。
Wix、Squarespace、およびその他のドラッグアンドドロップビルダー
これらのプラットフォームは、視覚的で直感的に物事を行うことに重点を置いています。エディタ内で埋め込みウィジェットまたはHTMLブロックを探してください。それをページにドラッグし、iframeコードを貼り付け、好みに合わせて位置を調整します。
各プラットフォームはこの機能に少し異なる名前を使用しています—Wixは「HTML iframe」と呼び、Squarespaceは「コードブロック」を使用します—しかし概念は同じです。
埋め込まれたクイズのテストとカスタマイズ
クイズを埋め込みました。素晴らしい！しかし、ちょっと待ってください—それは実際にあなたが望むように機能していますか？
異なるデバイスでウェブサイトを開きます。スマートフォンではクイズは良く見えますか？タブレットではどうですか？物事が窮屈に見えたり引き伸ばされたりしている場合は、iframeコードの幅と高さの値に戻ってください。幅を100%に設定することは通常、レスポンシブデザインに驚くほど効果的ですが、高さはクイズの長さによって試行錯誤が必要かもしれません。
人々を陥れる厄介な問題があります：GoogleフォームがユーザーにGoogleアカウントでサインインすることを要求する場合、認証をしたくない一部の参加者を失うことになります。フォームの設定を再確認し、組織内の人々だけでなく、誰からでも回答を受け入れるように設定されていることを確認してください。
実際のクイズ受験体験をテストします。自分でクリックして進めてみてください。すべての質問が適切に表示されますか？問題なく送信できますか？コンテンツがGoogleフォームから埋め込み版に移動するときに、時々奇妙なフォーマットが忍び込むことがあります。
OnlineExamMakerの紹介：AIを使用して埋め込み可能なクイズを作成
Googleフォームは基本的なクイズには優れていますが、より堅牢なものが必要な場合はどうでしょうか？高リスクの評価を実行したり、詳細な分析を追跡したり、デザインと機能性をよりコントロールしたい場合は？
OnlineExamMakerの登場です。これはAIを活用した試験作成ソフトウェアで、クイズ構築を次のレベルに引き上げます。
これは単なる別のフォームビルダーではありません。OnlineExamMakerは、Googleフォームをメモ帳のように見せる機能を備えた、プロフェッショナルな試験やクイズを作成するために特別に構築されています。カンニング防止対策、問題バンク、ランダム化、詳細な分析、そしてあなたのクイズを独自のものに見せるカスタマイズ可能なブランディングなどを取り揃えています。
特に教師やトレーナーにとって、ランダム化された質問を含む制限時間付きの試験を作成する能力は、ゲームチェンジャーとなるでしょう。HRマネージャーは、詳細な候補者評価ツールと部門全体の完了率を追跡する能力を高く評価するでしょう。
OnlineExamMakerでAIを使用して次のクイズ/試験を作成
OnlineExamMakerでクイズを作成して埋め込む
プロセスは非常に簡単です。まず、OnlineExamMakerプラットフォーム内で試験やクイズを作成します。インターフェースは直感的です—質問を追加し、採点ルールを設定し、必要に応じて制限時間を構成し、ブランドに合わせて外観をカスタマイズします。
クイズの準備ができたら、OnlineExamMakerはGoogleフォームと同様の埋め込みコードを生成しますが、より多くのカスタマイズオプションを提供します。サイト内でのクイズの外観をコントロールしたいですか？できます。誰がクイズを受験し、どのように実行したかを追跡する必要がありますか？OnlineExamMakerはそれをカバーします。
OnlineExamMakerクイズの埋め込み方法の詳細なガイドは、彼らの公式ドキュメントにあり、埋め込みプロセスをステップバイステップで説明しています。寸法のカスタマイズ、ポップアップまたはインラインディスプレイの選択、さらにはサイトに完全にネイティブに感じられるように体験をホワイトラベル化するオプションなどが見つかります。
いつGoogleフォームよりもOnlineExamMakerを選ぶべきですか？
Googleフォームは、シンプルなフィードバックフォームやカジュアルなクイズに最適です。しかし、認定試験、従業員評価、またはセキュリティと詳細な報告が重要なシナリオが必要な場合、OnlineExamMakerが輝きます。
この違いを次のように考えてみてください：Googleフォームは親しみやすい近所のカフェのようなもの—カジュアルな集まりに最適です。OnlineExamMakerはプロフェッショナルなコンファレンスセンター—あなたが期待するすべての設備を備えた本格的なビジネスに対応しています。
クイズ埋め込みに関するよくある質問とトラブルシューティングのヒント
なぜ私のクイズがウェブサイトに表示されないのですか？
まず、あなたのウェブサイトがiframeを許可しているか確認してください。一部のプラットフォームやセキュリティ設定はそれらを完全にブロックします。その場合、クイズが表示されるべき場所に空白だけが表示されるかもしれません。また、コードをリッチテキストエディタではなく、HTML編集領域に貼り付けていることを確認してください。リッチテキストエディタはコードを取り除く可能性があります。
埋め込まれたときのGoogleフォームクイズの見た目をカスタマイズできますか？
Googleフォームは、フォーム内での限られたカスタマイズを提供します—テーマカラーを変更したり、ヘッダー画像をアップロードしたりできます。しかし、埋め込まれたバージョンは常にGoogleの基本的なスタイリングを維持します。外観をよりコントロールするには、OnlineExamMakerのようなプラットフォームが広範なブランディングオプションを提供します。
埋め込まれたクイズを受験できる人数に制限はありますか？
Googleフォーム自体はフォームごとに最大500万件の回答を処理できますが、これはほとんどの人が必要とする以上です。制限は、クイズ自体というよりも、むしろあなたのウェブサイトのトラフィック容量である可能性が高いです。
クイズを埋め込んだ後に変更したい場合はどうすればいいですか？
良いニュース—埋め込みコードを更新する必要はありません。元のGoogleフォームに加えた変更は、埋め込まれたバージョンに自動的に反映されます。フォームを編集すれば、埋め込まれたクイズは即座に更新されます。
私のクイズはデスクトップでは良く見えますが、モバイルではひどいです。助けてください？
これは通常、幅と高さの値に帰着します。width=”100%”を使用して、画面サイズに合わせてスケールすることを確認してみてください。高さについては、小さな画面用に調整するためにCSSでメディアクエリを使用する必要があるかもしれませんし、デバイス間で機能する合理的な固定高さを単純に設定するだけかもしれません。