AI要約
WordPressフォームをサイトのポップアップに追加しますか？ ポップアップにフォームを表示することは、より多くのリードを獲得し、ビジネスの売上を伸ばすための優れた方法となります。
このチュートリアルでは、WPFormsとOptinMonsterを使用してポップアップフォームを作成する方法を説明します。
開始する前に、WPFormsがWordPressサイトにインストールされ、有効化されていることを確認してください。
OptinMonsterのインストール
まず、ポップアップやその他のマーケティングソリューションを作成するための強力なWordPressプラグインであるOptinMonsterをインストールしてください。
プラグイン » 新規追加に移動し、検索バーでOptinMonsterプラグインを検索します。
次に、今すぐインストールボタンをクリックしてプラグインをインストールします。
OptinMonsterプラグインをインストールしたら、有効化をクリックしてプラグインを有効にします。
注意：さらにヘルプが必要な場合は、WPBeginnerのWordPressプラグインのインストール方法ガイドを確認してください。
サイトとOptinMonsterの接続
OptinMonsterプラグインを有効にすると、セットアップウィザードを通じてサイトをOptinMonsterに接続するように求められます。OptinMonsterアカウントをお持ちの場合は、既存のアカウントを接続をクリックして続行します。
表示される新しいダイアログで、WordPressに接続をクリックします。
OptinMonsterは、ログインするとすぐにサイトに自動的に接続されます。
フォームの作成
OptinMonsterのインストールが完了したので、ポップアップフォームの設定を行います。開始するには、新しいフォームを作成してください。
この例では、シンプルな連絡先フォームテンプレートを使用してフォームを作成します。これを行うには、WPForms » 新規追加に移動します。次に、テンプレートを使用ボタンをクリックして、シンプルな連絡先フォームテンプレートを選択します。
これによりフォームビルダーに移動し、追加フィールドをフォームプレビューエリアにドラッグアンドドロップして追加できます。
フォームからフィールドを削除するには、フィールドにカーソルを合わせて、赤いゴミ箱アイコンをクリックします。
フォームの編集が完了したら、保存ボタンをクリックして変更を保存してください。
フォームを保存した後、さらにカスタマイズは設定タブで利用できます。
フォームが送信されたときにメールを受信したい場合は、フォーム通知の設定方法ガイドを確認してください。また、必要に応じてフォームの確認設定を設定することもできます。
注意：一部のWPFormsフィールドはOptinMonsterポップアップと互換性がありません。公開する前に、ポップアップでフォームをプレビューおよびテストすることをお勧めします。
OptinMonsterでポップアップを作成する
フォームの準備ができたので、ポップアップの作成を開始できます。開始するには、OptinMonster » Campaigns に移動し、Add New をクリックします。
これにより、テンプレート画面が表示されます。デフォルトでは、OptinMonster はキャンペーンタイプとして Popup を選択します。
利用可能なカテゴリからポップアップテンプレートを選択するか、目的のスタイルに最も近い検索語を入力してください。
使用したいテンプレートを選択し、Use Template ボタンをクリックします。
次に、Create Campaign ダイアログでキャンペーンに名前を付け、Start Building ボタンをクリックしてポップアップのカスタマイズに進みます。
次に、ポップアップが OptinMonster アプリで開かれ、そこでキャンペーンを好きなようにカスタマイズできます。
注意: OptinMonster でのキャンペーンの操作に関する詳細については、キャンペーンのデザインに関するドキュメントを確認してください。
WPFormsブロックの埋め込み
OptinMonster ポップアップにフォームを追加するには、左側のサイドバーにある WPForms ブロックを見つけます。検索ボックスで WPForms を検索することもできます。
次に、WPForms ブロックをクリックしてドラッグし、ポップアップの表示したい領域にドロップします。次に、フォーム選択ドロップダウンリストで、以前に作成したフォームを選択します。
注意: ドロップダウンリストにフォームが表示されない場合は、サイトを OptinMonster に接続したことを確認してください。
ポップアップの設定が完了したら、Save ボタンをクリックして変更を適用します。
ポップアップフォームの公開
ポップアップの設定がすべて完了したので、公開する時間です。これを行うには、まず Publish タブをクリックする必要があります。
次に、Publish Status の下にある Publish ボタンをクリックします。
これで、ポップアップがサイトで公開されます。
ポップアップフォームのプレビュー
ポップアップが公開されていない場合は、公開の手順に従ってフォームを公開してから、Preview ボタンをクリックします。
注意: プレビューは、ポップアップが少なくとも一度公開された後にのみ利用可能です。
これにより、新しいタブでサイトが読み込まれ、埋め込まれたフォームが表示されたポップアップが表示されます。
このポップアップを公開する準備ができていない場合は、プレビューが完了したら、必ず公開ステータスを Draft にリセットしてください。
注意: 下書きモードで OptinMonster キャンペーンをプレビューしようとすると、フォーム全体ではなく WPForms ショートコードが表示されます。これは正常であり、予期される動作です。フォーム全体を表示するには、キャンペーンを公開する必要があります。
よくある質問
以下に、WPForms でポップアップフォームを作成することに関するよくある質問にお答えします。
ポップアップで使用するフォームを変更しましたが、ショートコードしか表示されません。どうすればよいですか？
ポップアップが表示するフォームを変更した場合、上記のプレビュー方法が機能しなくなることに気付くでしょう。代わりに、ポップアップをプレビューすると、フォームのショートコードのみが表示されます。
これを修正するには、キャンペーンの公開ステータスを一時的に変更する必要があります。たとえば、公開ステータスが 下書きに設定されている場合は、公開に変更してください。
フォームはOptinMonsterポップアップ内で更新され、正しく読み込まれます。ポップアップをすぐに公開する準備ができていない場合は、プレビューが完了したら、公開ステータスが下書きに設定されていることを確認してください。
ポップアップフォームをGoogleスプレッドシートに接続できますか？
はい。WPFormsはGoogleスプレッドシートとシームレスに統合されます。この統合は、Googleスプレッドシートアドオンによって実現されます。
注意: フォームをスプレッドシートに接続するには、Googleスプレッドシートアドオンをインストールして有効にする必要があります。
アドオンをインストールし、Googleアカウントに接続した後、フォームフィールドをスプレッドシートの列にマッピングできるようになります。
フォームをGoogleスプレッドシートに接続する方法の詳細については、Googleスプレッドシートアドオンチュートリアルをご覧ください。
これで、WPFormsでポップアップフォームを作成する方法がわかりました。
次に、公開する前にフォームをテストしますか？完全なフォームテストチェックリストで、プロセスをステップバイステップで説明します。