<html lang="ja-jp" dir="ltr"><head></head><body>### [WPFormsとAMPの使用](https://wpforms.com/docs/how-to-use-wpforms-with-amp/)

**公開日:** 2023年11月23日
**著者:** Umair Majeed

**抜粋:** フォームがAMPで正しく機能することを確認する方法を学びましょう。

**コンテンツ:**

サイトでGoogle AMPを使用してモバイルページの読み込み時間を短縮していますか？ AMP（Accelerated Mobile Pages）を設定して、モバイルデバイスでのサイトの読み込みを高速化できます。ただし、サイトの一部の機能が正しく機能しなくなる可能性もあります。

このチュートリアルでは、WordPressサイトでWPFormsとAMPを連携させる方法を説明します。

- [Google AMPとは？](#what-is-amp)
- [WPFormsへのAMP互換性の追加](#amp-compatibility)
- [WPFormsとAMPでのreCAPTCHAの使用](#recaptcha)

**要件:** Google AMP互換性は[WPForms Lite](https://wordpress.org/plugins/wpforms-lite/ "WordPress.org: WPForms Lite")でのみ利用可能です。さらに、WPFormsがGoogle AMPと連携するには、サイトにSSL証明書がインストールされており、HTTPS経由で読み込まれている必要があります。HTTPSへの移行方法がわからない場合は、WPBeginnerの[このプロセス](https://www.wpbeginner.com/wp-tutorials/how-to-add-ssl-and-https-in-wordpress/)に関するチュートリアルを参照してください。

---

## Google AMPとは？

[Google AMP](http://www.wpbeginner.com/wp-tutorials/how-to-properly-setup-google-amp-on-your-wordpress-site/ "How to Properly Setup Google AMP on Your WordPress Site")（Accelerated Mobile Pages）は、モバイルユーザー向けのWebコンテンツの読み込みを高速化することを目的としたオープンソースイニシアチブです。

しかし、これらの読み込み速度の向上を達成するために、AMPは多くのリソースの読み込みをブロックします。その結果、AMPページでは一部の機能が期待どおりに動作しなくなります。

たとえば、デフォルトでは、WPFormsはフォームがAMPページで読み込まれているかどうかを自動的に検出します。AMPページが検出された場合、ユーザーはページの完全な（AMPではない）バージョンを読み込むためのリンクが表示されます。

![AMPと互換性のないフォームページがモバイルデバイスに表示されている様子](https://wpforms.com/wp-content/uploads/2019/06/amp-incompatible-form-page-1.png)そのため、WPFormsにはGoogle AMP専用の互換性が含まれています。

## WPFormsへのAMP互換性の追加

**注意:** Number SliderフィールドとModern Style Dropdownフィールドは、AMPを使用している場合はサポートされません。WordPressサイトでAMPを有効にしたい場合は、代わりにClassic Style DropdownフィールドとNumbersフィールドを使用することをお勧めします。

開始するには、公式の[WordPress用Google AMPプラグイン](https://wordpress.org/plugins/amp/ "WordPress.org: AMP")をインストールして有効化する必要があります。プラグインのインストール方法の詳細については、[WPBeginnerのガイド](https://www.wpbeginner.com/beginners-guide/step-by-step-guide-to-install-a-wordpress-plugin-for-beginners/ "How to Install a WordPress Plugin – Step by Step for Beginners")を参照してください。

Google AMPプラグインのセットアップウィザードを使用して、必要な設定を構成できます。詳細については、AMPとWordPressの使用に関するWPBeginnerの完全なチュートリアルを参照してください。

フォームとAMPプラグインの統合に追加の設定は必要ありません。互換性は、埋め込まれたすべてのフォームに自動的に追加されます。

## WPFormsとAMPでのreCAPTCHAの使用

AMPでWPFormsでreCAPTCHAを使用するには、reCAPTCHA v3を使用する必要があります。これはAMPでサポートされている唯一のreCAPTCHAバージョンです。

この機能を有効にするためのステップバイステップガイドについては、[WPFormsでのreCAPTCHAの設定](https://wpforms.com/docs/setup-captcha-wpforms/ "How to Set Up reCAPTCHA in WPForms")に関するチュートリアルを参照してください。

現在フォームでv2 reCAPTCHAを使用している場合は、v3 reCAPTCHAに切り替えるためにセットアッププロセス（新しいキーの作成を含む）を繰り返す必要があります。

AMPページでreCAPTCHAを機能させたい場合は、reCAPTCHAの設定で有効にする必要があります。

これを行うには、[reCAPTCHA管理ダッシュボード](https://www.google.com/recaptcha/intro/v3.html)にアクセスし、WPFormsに追加したv3 reCAPTCHAの歯車アイコンをクリックします。

![reCAPTCHA設定へのアクセス](https://wpforms.com/wp-content/uploads/2019/06/open-recaptcha-settings.png)次に、設定ページの最下部までスクロールし、**Allow this key to work with AMP pages**の横にあるチェックボックスを選択します。

![AMPページでのreCAPTCHAの許可](https://wpforms.com/wp-content/uploads/2019/06/allow-recaptcha-on-amp-pages.png)**注意:** CAPTCHA設定は、AMPページではデフォルトで非表示のreCAPTCHAになります。これは、ユーザーがAMPページに埋め込まれたフォームにreCAPTCHAバッジが表示されないことを意味します。

設定を保存することを忘れないでください。その後、AMPページにreCAPTCHAバッジが表示されるはずです。

最後に、[フォームのテスト](https://wpforms.com/docs/how-to-properly-test-your-wordpress-forms-before-launching-checklist/ "How to Properly Test Your WordPress Forms Before Launching [Checklist]")をAMPで行い、希望どおりに表示され、機能することを確認してください。

これで完了です！これで、サイトのモバイルユーザーがGoogle AMPを使用してフォームを表示および入力できることを確認できます。

次に、インターネット接続がない場合でもフォーム送信を収集する方法を学びたいですか？詳細については、[オフラインモードアドオン](https://wpforms.com/docs/how-to-install-and-set-up-the-offline-forms-addon/ "How to Install and Set Up the Offline Forms Addon")に関するチュートリアルを確認してください。

**カテゴリ:** 拡張, 機能拡張

---</body></html>