メインコンテンツへスキップ
見出し画像
Photo byakisuke0925

【第297回】 Marketing Cloud Next : 外部サイトへのフォームの埋め込み

    Marketing Cloud Next(Marketing Cloud Growth & Advanced Edition)では、新機能 Spring '25 リリースで、公開済みの登録フォームを iframe に対応した外部サイト埋め込むことで、あらゆる場所からリードを獲得することが可能になりました。

    この iframe とは、Web ページの中に別の Web ページを埋め込むための技術です。たとえば、YouTube をブログに埋め込んだり、外部の登録フォームや地図をサイトに表示したりする際に使われます。「ページの中に別のページを入れる窓」のようなものである、とよく例えられます。

    また、「iframe に対応」という言葉の意味は、iframe を使って埋め込んだコンテンツが問題なく表示されて機能することを指します。

    •  外部の地図や動画が正しく表示される

    •  スマートフォンやタブレットでもレイアウトが崩れない(レスポンシブ対応)

    Marketing Cloud Growth & Advanced Edition の登録フォームを外部サイトで使用する場合は、この iframe 対応の外部サイトである必要があります。まずは、この点を押さえて、設定の手順を追ってみましょう。


    設定手順

    今回、外部サイトとして、Marketing Cloud Engagement の Cloudpages に埋め込みをします。Cloudpages は iframe に対応しており、例えば、Youtube の動画などを含ませることができます。

    今回は、まず、正しい設定を行っていない場合に、Cloudpages にフォームが表示されないことを確認したいと思います。

    表示されない場合

    1. 公開済みフォームのプロパティの「埋め込み」タブから、フォームのコードを取得します。

    画像

    2. Cloudpages に HTML コンポーネントを配置して、コードをそのまま貼り付けます。

    画像

    3. これを公開しても、フォームは接続が拒否され、表示されません。

    画像

    表示させるための設定

    それでは、このフォームを表示させるための手順です。

    1. まず、Salesforce のセットアップで「すべてのサイト」を検索し、Marketing Landing Page の Builder を選択します。

    画像

    2. ビルダーの「設定」をクリックし、「セキュリティー&プライバシー」タブに移動し、クリックジャック保護レベルを「外部ドメイン上でサイトページのフレームを許可」に変更します。

    画像

    3. 続いて、そのすぐ下にある「インラインフレーム化の信頼済みドメイン」にある「+信頼済みドメインを追加」を選択します。

    画像

    4. ポップアップウィンドウに、Marketing Cloud Engagement の Cloudpages URL のドメインを入力し、信頼済みドメインを追加します。

    ・ ドメインの最後の「/」の有無は問いません。

    画像

    5. 信頼済みドメインの追加が完了したら、サイトを「公開」します。

    画像

    注意点

    • 公開作業を忘れないようにしましょう。 公開が完了するまで、信頼済みドメインの情報は反映されません。

    • この Marketing Landing Page のサイトはバックグラウンドで動作するために設計されたものです。コンテンツの追加は行わないでください。


    フォームを再度確認する

    1. これで再度 Cloudpages を更新すると、登録フォームが表示されました。

    画像

    2. フォームを送信すると、フローが動くことも確認できました。成功です。

    画像

    既知の問題

    現在、サイトが英語以外の言語で公開されている場合、フォームを埋め込むことはできません。

    回避策:
    英語以外の言語では埋め込みスクリプトの生成に問題があります。フォームの埋め込みコードで「/en-US/」を見つけて、サイトの言語に一致する言語コードに置き換え、変更したコードをフォームを表示する HTML に貼り付けます。

    画像

    日本語でフォームを作成した場合、「/ en-US/」、「/ja/」に変更します。
    ※「ja-JP」では表示されませんので注意してください。

    日本語でフォームを作成したか否かは、以下で確認できます。

    画像

    いかがでしたでしょうか。

    外部サイト用の登録フォームが、簡単に設定できたのではないでしょうか。最後にいくつかポイントをお伝えしておきます。

    設定のポイント

    • 外部サイトで「登録フォーム」を利用する際には、「ランディングページ」を作成する必要はありません。登録フォームとフローの設定まで完了していれば、問題なく機能します。

    登録フォームの設定手順は、以下の記事を参考にしてください。

    • フォームの内容を編集した場合でも、そのフォームを再公開するだけで、外部サイト上の表示が自動的に更新されます。

    • フォームを非公開にすると、外部サイトからフォームが消えます。

    • フォームの埋め込みコードには、可変部分として「私のドメイン」の情報が含まれています。運用の途中で「私のドメイン」を設定した場合は、外部サイト側に埋め込まれている埋め込みコードは自動的に更新されないので、手動で更新してください。正しく、デバイス ID が取得できなくなります。

    画像

    今回は以上です。


    次の記事はこちら

    前回の記事はこちら

    私の note のトップページはこちら

     
     
    Salesforce Marketing Cloud、Agentforce、Data Cloud、Salesforce 認定資格に関する実践的な情報を発信しています。これらの記事が、皆さまの学習や日々の業務に少しでもお役に立てば幸いです。