ハウツー記事

GTMでFacebook Webチャットを追加する方法

Gerardo Salandra
最高経営責任者(CEO)。Respond.io
2018年10月18日

Facebook Customer Chat Plugin は、あなたのウェブサイト上に直接Facebook Messenger を置く、信じられないほどの無料のライブチャットプラグインです。従来のライブチャットベンダーのように、Facebook は、あなたのサポートスタッフが訪問者、ユーザー、および顧客とチャットできる Facebook Inbox と呼ばれるバックエンドを提供します。しかし、他のライブチャットとは異なり、Facebook は、彼らがあなたのウェブサイトを去った後でも、あなたの連絡先にメッセージを返すことができ、彼らはFacebook Messenger アプリであなたのメッセージを受信することができます。問題は、Google タグマネージャで Facebook ウェブチャットをインストールできないことです。

FacebookのウェブチャットコードがGTMで動作しない理由

Google タグマネージャを使用して、またはWordpressアドオンを介して埋め込みコードを管理したい場合は、これが不可能であることがわかりますFacebook カスタマーチャットプラグインコードが提供するFacebook 。

The code provided is an HTML snippet, a <div> that must be pasted on every site page individually. This is a problem if you have 100 pages. The obvious option is add to the Facebook Customer Chat script to Google Tag Manager (GTM).

Facebook カスタマーチャットSDKはGoogle Tag Managerと連携しません。
Facebook カスタマーチャットSDK

Facebook カスタマーチャットコードは、Facebook SDKとカスタマーチャットコードを貼り付ける必要があるため、Facebook Web Chat withGoogle Tag Manager (GTM)をインストールする現実的な方法は存在しません。Facebook Customer Chat SDKは、Google Tag Manger (GTM)と共に動作することができないため、 Tag Manger (GTM)は、 Customer Chat SDKと一緒に動作します。

Facebook カスタマーチャットコード

この埋め込みコードを、google タグマネージャで使用できるスクリプトに変換する方法が必要です。

Facebook Web Chat WithGoogle Tag Managerのインストール方法

Facebook Customers Chat Plugin をGoogle Tag Manager (GTM) にインストールするには、次のものが必要です。

1 Rocketbots プラットフォームにログイン し、スペースを作成します。Facebook ページを接続するためのスペースが必要です。

GTMを使用してウェブサイトにFacebook カスタマチャットプラグインを追加するために、すでに1つを持っていない場合はスペースを作成します。
スペースがない場合は、スペースを作る

2Facebook Messenger, 選択し、次へを押して、接続したいFacebookページを選択します。

Facebook Messenger GTMを使用してFacebookカスタマーチャットプラグインをウェブサイトに追加することを選択します。
セレクトFacebook Messenger

3 チャンネルの詳細を記入 し、追加をチェックFacebook's Customer Chat Widget to your website?

オプションのCustomer ChatプラグインをGTMを使用してあなたのウェブサイトに追加するためのチェック
オプションのCustomer Chatプラグインを追加するためのチェック

4.ドメインをホワイトリスト化し、色を選択し 、詳細設定を記入する。

ホワイトリストのドメイン&Facebook カスタマーチャットプラグインをあなたのウェブサイトに追加する色を選択Facebook カスタマーチャットプラグイン
ホワイトリストに登録されたドメインと色の選択

Facebook Customer Chat Plugin からのコンタクトの場合、この参照コードにより、独自のオンボーディングオートメーションを開始することができます。

Google タグマネージャでFacebook カスタマチャットプラグインをウェブサイトに追加するための詳細設定の調整
アドバンスド・セッティングの調整

5.スクリプトをコピーします。

Google Tag Manager を使ってFacebook Customer Chat Plugin をあなたのウェブサイトに追加するスクリプトをコピーします。
コピー・ザ・スクリプト

6.スクリプトをカスタムHTMLタグとしてGTMに挿入します。

スクリプトを貼り付けて、Facebook カスタマチャットプラグインをGoogle タグマネージャであなたのウェブサイトに追加します。
スクリプトの貼り付け

7.RocketbotsのDoneをクリックして、ページを確認します。

Google Tag Manager でFacebook Customer Chat Plugin を追加するためにあなたのサイトをチェックします。
サイトの確認

さて、それはそんなに難しいことではありませんでしたか?Rocketbots プラットフォームを使用すると、スクリプトとして GTM と Wordpress アドオンで実際に動作する新しいFacebook 顧客チャット コードを生成するのがはるかに簡単で、はるかに苦痛がないことがわかります。

Facebook Customer Chat Plugin と共に、Rocketbots プラットフォームでコンタクトを管理することもより簡単になることがお分かりいただけるでしょう。Rocketbots の AI はFacebook カスタマーチャットでのあなたの会話から学習し、学習すればするほど、より多くの役立つスマートリプライ、類似の質問に対するあなたの過去の回答に基づいているワンクリックリプライを配信するようになります。学習が進めば、AIがあなたの回答を自動化することも可能になります。

タグ
クリップボードにコピーされました

準備はいいですか?✨

  • respond.io のパワーを解き放ち、売上を伸ばし、顧客を喜ばせよう。
  • 14日間無料トライアル
  • クレジットカード不要
  • いつでもキャンセル可能
無料会員登録
  • 個別デモをご体験ください
  • 10,000以上の企業から選ばれる理由をご覧ください。
デモを予約する