ワードプレスのフォームにカレンダーに追加オプションを追加する

WordPressのフォームにカレンダーに追加オプションを追加する方法

WordPressのフォームにカレンダーに追加オプションを追加したいですか?

あなたのサイトに登録した後、サイト訪問者のカレンダーにイベントの日付を追加する簡単な方法を提供することは、人々が感謝する付加的な個人的なタッチです。もしご希望であれば、フォームの確認やEメール通知にこのオプションを追加することもできます。

この記事では、WordPressのフォームにカレンダーに追加オプションを追加する方法を紹介します。これにより、サイト訪問者はあなたのウェブサイトのフォームを送信した瞬間から、今後のイベントの計画を立てることができます。

WordPressフォームを今すぐ作成

WordPressのフォームにカレンダーに追加オプションを追加する方法

ステップ1: WordPressフォームの作成

まず最初に行う必要があるのは、WPFormsプラグインをインストールして有効化することです。詳しくは、WordPressにプラグインをインストールする方法のステップバイステップガイドを参照してください。

この例では、シンプルな誕生日パーティーのRSVPフォームを作成します。このステップについては、WordPressでRSVPフォームを作成する方法のチュートリアルをご覧ください。

バースデーパーティーの招待状RSVPフォームのテンプレートは、フォームビルダーでどのように見えるかを示します:

フォームビルダーの誕生日招待状RSVPフォームテンプレート

パーティーの日時を知らせる小さなメッセージをフォームに追加するには、フォームビルダーの左側にあるコンテンツフォームフィールドを右側のプレビューエリアにドラッグするだけです。その後、フィールドをクリックして変更します。

フォームに追加したものは以下の通り:

RSVPフォームにコンテンツフィールドを追加する

さて、いよいよフォームに「カレンダーに追加」オプションを追加します。

ステップ2:Googleカレンダーにイベントを作成する

フォームにカレンダーオプションを追加する前に、まず最初にすることは、Googleカレンダーにイベントを作成することです。

Googleアカウントにログインし、Googleカレンダーにアクセスします。イベントの作成」をクリックし、イベントの詳細を入力してください。

Googleカレンダーの新規イベントを作成する

保存をクリックすると、イベントがカレンダーに保存されます。

次に、カレンダーでイベントを見つけて、3つの点のアイコンをクリックします。ドロップダウンメニューから「イベントを公開」を選択します。

Googleカレンダーのイベントを公開する

そうすると、イベントへのリンクを含むポップアップモーダルが表示されます。WordPressのフォームで使用するためにリンクをコピーしてください。

Googleカレンダーのイベントリンクをコピーする

公開したイベントをサイト訪問者に見てもらうには、Googleカレンダーが "公開 "に設定されていることを確認する必要があります。

Googleカレンダーを「公開」に変更するには、まずカレンダーのドロップダウンから「設定」を選択します。

Googleカレンダーの設定を開く

次に、公開したいカレンダーをクリックし、イベントへのアクセス許可までスクロールダウンし、公開するチェックボックスをクリックします。

Googleカレンダーを公開する

Googleカレンダーを「公開」にすることで、Google検索経由でも、あなたのカレンダーのすべてのイベントが世界中に公開されます。カレンダーにプライベートな予定がある場合は、サイト訪問者に自分のカレンダーに追加してもらいたい予定用に、別のGoogleカレンダーを作成することをお勧めします。

これでWordPressのフォームにイベントを追加する準備ができました。

ステップ 3: WordPressのフォームにカレンダーに追加オプションを追加する

カレンダーに追加」オプションをフォームに含めることができる場所はいくつかあります:

  1. フォーム自体について
  2. フォームの確認
  3. Eメール通知

まず、実際のフォームにカレンダーに追加オプションを追加する方法を見てみましょう。

まだの場合は、左側から右側のパネルにドラッグして、イベントフォームにコンテンツフォームフィールドを追加してください。

最初からこのフォーム・フィールドを追加したのは、私たちのイベントについて少しでも知ってもらいたかったからです。

コンテンツ・フォーム・フィールドが追加されたら、それをクリックして変更します。Googleカレンダーからコピーしたリンクを追加します。

コンテンツフィールドにGoogleカレンダーリンクを追加する

完了したら、フォームビルダーの一番上にある「保存」をクリックします。

フォームの保存

サイト訪問者がGoogleカレンダーと書かれたCTAボタンをクリックすると、Googleが開き、アカウントへのサインインを促します。そして、あなたが追加したすべての詳細とともにイベントが表示され、訪問者は自分のカレンダーに保存することができます。

実際のWordPressフォームにカレンダーに追加オプションを表示したくない場合は、フォームの確認や通知にイベントへのリンクを追加することができます。

ステップ4: フォームの確認メッセージにカレンダーに追加オプションを含める

フォームの確認は、サイト訪問者があなたのウェブサイトでフォームを送信すると表示されるメッセージです。フォームが送信されたことを知らせ、次のステップを知らせることができます。

WPFormsには3つの確認タイプがあります:

  1. メッセージこれはWPFormsのデフォルトの確認タイプです。サイト訪問者が RSVP フォームを送信すると、フォームが通過したことを知らせるシンプルな確認メッセージが表示されます。
  2. ページを表示。この確認タイプは、サイト訪問者をサイト上の特定のウェブページに誘導し、RSVPのお礼を述べます。この方法については、お客様をサンキューページにリダイレクトするチュートリアルをご覧ください。
  3. URLに移動(リダイレクト)。このオプションは、サイト訪問者を別のウェブサイトに送りたい場合に使用します。

イベントフォームでは、サイト訪問者がすぐにGoogleカレンダーにイベントを追加できるように、カレンダーに追加オプションを含む確認メッセージを作成します。

まず、フォームエディターの「設定」にある「確認」タブをクリックします。

次に、作成したい確認タイプを選択します。この例では、「メッセージ」を選択します。

RSVPフォームの確認設定を開く

フォームの確認でカレンダーにイベントを追加するオプションを追加しているため、2つのオプションがあります:

  1. シンプルなメッセージを1つ作成し、メッセージに「カレンダーに追加」オプションを追加する。
  2. 複数の確認フォームを作成し、スマートな条件ロジックを有効にすることで、出席予定者または出席する可能性のある人のみに、カレンダーに追加オプション付きの確認メッセージが表示されるようにします。

簡単にするために、イベントに参加する予定があるかどうかにかかわらず、すべてのサイト訪問者に表示される1つの確認メッセージを作成します。テキストを入力し、Googleカレンダーのイベントリンクを追加するだけです。

確認メッセージにGoogleカレンダーのイベントリンクを追加する

RSVPフォームを送信すると、このような確認画面が表示されます:

Googleカレンダーへのリンクを含む確認メッセージ

この場合も、サイト訪問者はGoogleカレンダーのリンクをクリックし、あなたのイベントを自分のカレンダーに追加するだけです。

複数のフォーム確認を作成し、条件付きロジックを使用して、RSVPの回答に応じて異なるメッセージを表示したい場合は、条件付きフォーム確認の作成に関するチュートリアルをご覧ください。

ステップ 5: フォームのメール通知にカレンダーに追加オプションを追加する

WordPressのフォームにカレンダーに追加オプションを追加できる最後の場所は、あなたのウェブサイトでフォームを送信したときに受け取るEメール通知です。

しかし、この方法を説明する前に、RSVPフォームにEmailフォームフィールドがあることを確認する必要があります。これがWPFormsがサイト訪問者に通知をメールで送る唯一の方法です。

イベントフォームにメールフォームフィールドを追加したら、フォームエディタの設定"通知を開いてください。

フォームの通知設定にアクセスする

デフォルトでは、誰かがあなたのサイトでフォームを送信すると、常にEメール通知が届きます。

ただし、サイト訪問者にも確実に通知を受け取るようにするには、スマートタグを使用して、サイト訪問者の電子メールをメール通知に追加する必要があります。

これを行うには、「スマートタグを表示」をクリックします。

通知設定にスマートタグを表示する

次に、ドロップダウンメニューからEメールオプションを選択し、サイト訪問者がRSVPフォームに入力したEメールにEメール通知を送信することをWPFormsが認識できるようにします。

スマートタグを使用した送信先メールアドレス設定へのメールフィールドの追加

次は、「カレンダーに追加」オプションを使ってメッセージをカスタマイズする番だ。

この方法では、GoogleカレンダーリンクのHTMLコードが必要です。Googleカレンダーの公開設定に戻り、ポップアップ・モーダルからHTMLオプションをコピーしてください。

GoogleカレンダーのイベントリンクのHTMLをコピーする

フォームビルダーに戻り、「Eメール メッセージ」までスクロールダウンし、Eメールに表示させたいメッセージを追加します。次にGoogleカレンダーイベントのHTMLコードを貼り付けます。

GoogleカレンダーのイベントHTMLをメール通知メッセージに追加する

これで、誰かがあなたのイベントフォームに入力するたびに、Googleカレンダーにイベントを追加するボタンが付いた通知が届くようになります。

メール通知にGoogleカレンダーボタン

次に、WordPressのフォームに日付ピッカーを追加します。

これで完成です!これで、WordPressのフォームにカレンダーに追加オプションを追加して、サイト訪問者が自分のGoogleカレンダーに簡単にイベントを追加できるようにする方法がわかりました。

イベントや予約用のフォームを作成する場合は、日付ピッカー付きのWordPressフォームを作成する方法についてのガイドもお勧めです。

訪問者がWordPressの共有カレンダーにカレンダーイベントを追加できることをご存知ですか?ここでは、ユーザーが投稿したイベント用のフォームを追加する簡単なガイドをご紹介します。

もし全てのサイト訪問者があなたのイベントフォームを見て記入することを心配しているなら、WPFormsを使えば特定のフォームパーミッションを有効にすることができるので、パスワードを持った人だけがあなたのイベントフォームに記入し送信することができます。このステップについては、WordPressのフォームをパスワードで保護する方法についての簡単なチュートリアルをご覧ください。

何を待っているのですか?今すぐ最強のWordPressフォームプラグインを使い始めましょう。

この記事が気に入ったら、フェイスブックと ツイッターをフォローしてください。

情報開示私たちのコンテンツは読者支援型です。つまり、あなたが私たちのリンクをクリックした場合、私たちはコミッションを得る可能性があります。WPFormsがどのように資金を調達しているのか、なぜそれが重要なのか、そしてどのように私たちをサポートできるのかをご覧ください。

クレア・ブロードリー

クレアはWPFormsチームのコンテンツマネージャーです。彼女は13年以上のWordPressとウェブホスティングに関する執筆経験があります。もっと知る

最高のWordPressドラッグ&ドロップフォームビルダープラグイン

簡単、速い、安全。WPFormsを信頼する600万人以上のWebサイトオーナーの仲間入りをしてください。

このフォームを入力するには、ブラウザのJavaScriptを有効にしてください。

6 comments on "WordPressのフォームにカレンダーに追加オプションを追加する方法"

  1. メールにカレンダーを挿入する方法を教えてください。 (apple).

    .ICS WordPress フォームをメール通知に追加する方法

    1. ヤン、こんにちは、

      iCalendarをEメール通知に挿入する方法が組み込まれていないので、申し訳ありません。そうですね!今後の機能強化のために、機能リクエストとして検討させていただきます。

      ご理解ありがとうございます! 🙂。

  2. 私の組織のメンバー全員がグーグル・アジェンダを持っているわけではない。ある人はoutlookを使っているし、ある人はicalenderを使っている。このプロジェクトはグーグルユーザーのみを対象にしていますね?

    1. パトリック - Googleカレンダーにカレンダー追加オプションを追加するには、Gmailアカウントが必要です。Outlookと接続したい場合は、Zapierインテグレーションをご利用ください。GoogleカレンダーとiCalendarを 統合することもできます。とはいえ、もし別のインテグレーションをお探しでしたら、お気軽にお問い合わせフォームから詳細をご連絡ください。

  3. とても助かります!予約のスケジューリングに'カレンダーのオプションを追加'する方法を教えてください。予約の場合、googleカレンダーのイベントを前もって作成することはできません。

    1. マイケル - 喜んでお手伝いさせていただきます!お時間がありましたら、サポートまでご連絡ください。

      WPFormsのライセンスをお持ちの方は、メールサポートをご利用いただけますので、サポートチケットを送信してください。

      それ以外の場合は、WPForms Lite WordPress.orgのサポートフォーラムで限定的な無料サポートを提供しています。

      ありがとう🙂。

コメントを追加する

コメントをお寄せいただきありがとうございます。すべてのコメントはプライバシーポリシーに従って管理され、すべてのリンクはnofollowであることにご留意ください。名前欄にはキーワードを使用しないでください。個人的で有意義な会話をしましょう。

このフォームはCloudflare Turnstileによって保護されており、Cloudflareプライバシーポリシーおよび利用規約が適用されます。