Formfacade を使用した Google フォームの埋め込み

要件

  • Google または G Suite アカウント
  • Formfacade から Google フォームへの接続
  • WordPress 用 Formfacade プラグイン (オプション)

Formfacade を Google
フォームに接続する

  1. Formfacade にアクセスし、[ TRY IT FREE ] をクリックします。
  2. [Install] ボタンをクリックします。
  3. [CONTINUE] をクリックします。
  4. Google アカウントを選択します。
  5. [Allow] をクリックして続行します。
  6. [DONE] ボタンをクリックします。

埋め込む Google
フォームのコードを取得する

  1. Google フォーム (http://google.com/forms/) に移動します。
  2. 埋め込むフォームを選択します。
  3. 設定メニューの [ログインが必要]
    がオフになっていることを確認します。
  4. [アドオン] メニューをクリックします。
  5. [Formfacade] を選択します。
  6. [ウェブページに埋め込む] をクリックします。
  7. [WordPress サイトに埋め込む] を選択し、[Next] をクリックします。
  8. 表示されたコードをコピーし、[Next] をクリックします。
  9. アンケートに回答します。

WordPress
を起動し、フォームを埋め込み、新しいデプロイを生成します

  1. Shifter ダッシュボード (https://go.getshifter.io/)
    にログインします。
  2. [Start WordPress] をクリックします。
  3. WordPress ダッシュボードで、[ページ] メニューの [新規追加]
    をクリックして新しいページを作成します。
  4. [+] をクリックしてブロックを追加します。
  5. [カスタム HTML] を入力し、[カスタム HTML] ブロックを選択します。
  6. Formfacade から生成された Google
    フォームのコードを貼り付けます。
  7. [公開] をクリックします。
  8. アーティファクトを生成してデプロイします。

Google
スプレッドシートで回答を確認する

  1. Google フォームのフォームページに戻り、フォームを選択します。
  2. メニューアイコンをクリックします。
  3. [回答の送信先を選択] を選択します。
  4. 送信先を選択し、[作成] または [選択] します。

以上です！

オプション:
Formfacade
のプラグインを使用して、お問い合わせフォームを埋め込むためのショートコードを使用する

  1. Google フォーム (http://google.com/forms/) に移動します。
  2. 埋め込むフォームを選択します。
  3. [送信] ボタンをクリックします。
  4. リンクアイコンをクリックします。
  5. [コピー] ボタンをクリックしてフォームの URL をコピーします。
    • このサンプルでは、コピーされた URL は
      https://docs.google.com/forms/d/e/1FAIpQLSdOKVyhfEiEu6Giu3oDWAdQNct6hXoZ2_yihUU0DjKkNnEASQ/viewform?usp=sf_link
      です。
  6. Shifter ダッシュボード (https://go.getshifter.io/)
    にログインします。
  7. [Start WordPress] をクリックします。
  8. [プラグイン] メニューの [新規追加] をクリックします。
  9. 「FormFacade」を検索し、インストールして有効化します。
  10. [ページ] メニューの [新規追加]
    をクリックして新しいページを作成します。
  11. [ブロックを追加] ボタンをクリックします。
  12. [ショートコード] を選択します。
  13. [formfacade id=] を入力します。
  14. 「id=」の後にコピーした URL を貼り付けます。
  15. ショートコード内の「 https://docs.google.com/forms/d/e/
    」と「/viewform?usp=sf_link」を削除します。

    • このサンプルでは、ショートコードは
      [formfacade id=1FAIpQLSdOKVyhfEiEu6Giu3oDWAdQNct6hXoZ2_yihUU0DjKkNnEASQ]
      です。
  16. ページを公開し、フォームが動作することを確認します。アーティファクトを生成してデプロイします。

以上です！