Search
Duplicate
▪️

Google Tag Managerの活用方法

大変恐縮ながら、GTMは外部サービスのため、正確でない情報をお伝えすることのないように、弊社でサポートは行っておりませんのでその点のみご了承くださいませ
目次

チャネルトークテンプレートを活用する方法

1. チャネルトークのGTMのテンプレートを追加しましょう！
•
コードの追加をせず！チャネルトークが提供するGoogleタグマネージャーのスクリプトを利用して、チャネルトークをさらに活用できます！
•
テンプレート > タグテンプレート > 検索ギャラリーでタグタイプをさらに見つけましょう の順にクリックしてください
•
チャネルトークが提供する Channel.io をテンプレートで検索して、ワークスペースに追加 してください！
2. タグを新規作成して、Actionを設定しましょう！
チャネルトークのテンプレートを利用して、実行できるアクションを選択します！
•
Track (Send event)：（これから設定するトリガーが発火されたときに）あるイベントが発生した！とチャネルトークに送信します
→ マーケティング機能の自動配信にて、配信トリガーに設定したいときに活用できます
•
Show (Show messenger)：（これから設定するトリガーが発火されたときに）チャネルトークのチャット画面を開きます
•
Hide (Hide messenger)：（これから設定するトリガーが発火されたときに）チャネルトーク のチャット画面を閉じます
3. トリガーを設定しましょう！
トリガーは、通常のGoogleアナリティクスのトリガーを設定しましょう！
おすすめ
•
スクロール○%
◦
10% （例：10%スクロールをしたら、Show (Show messenger)のアクションを実行してチャット画面を開いて表示する...など）
◦
70% （例：商品リストを70%スクロールしたら、Track (Send event) のアクションを実行してチャネルトークにイベントの発火を通知、自動配信の配信トリガーに設定して、コーディネートをおすすめするポップアップを表示...など）
◦
100%（例：ブログ記事を最後まで読んだら、Track (Send event) のアクションを実行してチャネルトークにイベントの発火を通知、自動配信の配信トリガーに設定して、資料請求に遷移させるポップアップを表示...など）
•
○秒経過
◦
10秒（例：ページに訪問してから10秒経過したら、Show (Show messenger)のアクションを実行してチャット画面を開いて表示する...など）
•
〇〇ボタンクリック
◦
"お問い合わせ"ボタン：サイト上の"お問い合わせ"ボタンをクリックしたら、Show (Show messenger)のアクションを実行してチャット画面を開いて表示する...など）

問い合わせ数やコンバージョン率を高める方法

ブログ記事やサービス紹介ページ、商品リストページなどで、スクロールを70% 以上した顧客に購買を誘導するポップアップを出しましょう！
1. スクロール70%トリガーを作りましょう
スクロールの割合は25%、50%などもちろんカスタマイズ可能です！
2. チャネルトークにトリガーの発火を伝えるタグを設定しましょう
チャネルトークにスクロール70%したイベント(トリガーの発火)を伝えるタグを設定します
•
先ほど追加したチャネルトークのテンプレートChannel.ioを選択してください！
•
Event Nameを入力します！
•
今回は、こちらのイベントを自動配信のポップアップの配信トリガーに設定したいので、 Actionを Track に設定しましょう
注意 ! タグとトリガーを設定して、保存ボタンを押したら、公開 ボタンを押してください！（公開する前に、プレビューでサイトにてきちんと動作するか確認もできます）
3. チャネルトークの自動配信を設定しましょう！
自動配信の詳しいガイドはこちらをご覧ください
•
配信トリガー にて、設定したイベントが見えるようになるまで、1分程度かかります
•
メッセージを作成して実行 しましょう！
設定はこれで完了です
4. ホームページでテストしてみましょう
•
スクロールを70%した時に、自動配信のポップアップが表示されるか確認しましょう

サイトの特定ボタンをクリックした時に自動でチャネルトークのチャット画面が開くようにする方法

1. 前もって設定しておいたクリックトリガーを活用して、チャネルトークのチャット画面が開くようにタグを設定しましょう
•
タグはチャネルトークのテンプレートを選択し、Actionを Show に設定しましょう
•
トリガーは、前もって作成したクリックトリガーを設定しましょう
•
タグを保存したら、公開 しましょう
2. ホームページでテストしてみましょう
特定のボタンを押したら、チャット画面が開くか確認しましょう！
画像引用：invoy(https://www.invoy.jp/)

特定のボタンをクリックした顧客に、ポップアップやSMSやメールを送る方法

1. 前もって設定しておいたクリックトリガーを活用して、チャネルトークのチャット画面が開くようにタグを設定しましょう
•
先ほど追加したチャネルトークのテンプレートChannel.ioを選択してください！
•
Event Nameを入力します！
•
今回は、こちらのイベントを自動配信のポップアップの配信トリガーに設定したいので、 Actionを Track に設定しましょう
•
トリガーは、前もって作成したクリックトリガーを設定しましょう
•
タグを保存したら、公開 しましょう
2. チャネルトークの自動配信を設定しましょう！
•
クリックトリガーに設定したボタンをクリックした顧客に購買を誘導するメッセージを送りましょう！
配信トリガーにて cartClick イベントを使った自動配信を設定しましょう
3. ホームページでテストしてみましょう
特定のボタンを押したら、チャット画面が開くか確認しましょう！
シークレットモードでテストすると正常に動作します！

イベントトラッキングをする方法

Googleタグマネージャー を使わなくとも、コードに手を加えることで簡単にjsのコード上で発生したイベントをトラッキングすることもできます。難しい場合は、開発者かチャネルトークにお問い合わせください - イベントトラッキングとは？ https://developers.channel.io/docs/what-is-an-event - jsコードでイベントトラッキングさせる方法 https://developers.channel.io/docs/web-chplugin#section-track
1.
ホームページにGoogleタグマネージャーを設置してください
2.
タグマネージャーの管理者画面から、トリガー > 新規 を押下して、トリガーを作成してください
例えば、"スクロール距離"をトリガーにしたい場合は、下の画像を参考にしてください！
3.
タグ > 新規 を押下し、下の画像のようにタグを作成してください
•
HTMLの欄にはこちらのコードをコピぺしてください
•
"スクロール70"と書いてある部分は、イベントの名前としてチャネルトークの管理者用アプリで表示されます。任意のイベント名を入力してください(ex. スクロール80, スクロール90)
<script> if (window.ChannelIO) { ChannelIO('track', 'スクロール70'); } </script>
JavaScript
4. タグマネージャー のメインページより右上の"公開"ボタンを押してください
5. 公開が完了したら、5分後にはチャネルトークから新しいイベントが発生したのを確認できるようになります！

特定の顧客にのみチャットボタンを表示させる方法

特定の顧客だけにチャットボタン自体を表示したい場合には、チャネルトークのboot(起動)コードを、チャットボタン表示させたいお客様がサイトにアクセスしているときにだけ挿入するように、出しわけをすることで可能です！ エンジニアの方に直接御社のコードをカスタマイズしていただくか、Googleタグマネージャーを活用しましょう！ ※チャネルトーク単体では難しいです
すでにGoogleタグマネージャーがインストールされているという前提でガイドいたします！
datalayerを使う方法です！
1. 以下のように御社のサイトにて、GTMのdatalayerに顧客Idなどを渡しましょう(この作業はエンジニアの方が必要です！)
<script> dataLayer.push({ 'memberId': 'fdhu341hkh3143k31', 'name': 'aya', 'email': 'aya@channel.io', 'mobileNumber': '+819012345678' // その他会員情報を連携したい任意の情報をセット }) </script>
JavaScript
2. GTMの管理画面から上記のdatalayerの値を渡す変数を登録しましょう
まずは変数の新規作成ボタンを押して
変数を登録します
nameやemail、mobileNumber、その他任意でdatalayerに追加した項目も同じように全て登録します！
3. トリガーを作成しましょう
新規作成ボタンをクリックしたら、
特定の顧客Id(memberId)の顧客がページビュー(ページ閲覧)する場合をトリガーに設定します
このmemberIdのフィルタリングで、チャネルトークを表示させたい特定の顧客Idをターゲティングしましょう
4. タグを作成しましょう
新規作成ボタンをクリックしたら
タグを作成しましょう
チャネルトークのスクリプトの赤ワク部分をカスタマイズして、挿入してください！
サンプルコード
・"YOUR_PLUGIN_KEY"には、以下のイメージを参考にあなたのチャネルのPlugin Keyを挿入してください！
5. 保存したあと、公開したら反映されます！

問い合わせ経由でコンバージョンしたかをGoogle アナリティクスでトラッキングする方法

すでにGoogleタグマネージャーとGoogleアナリティクスがサイトにインストールされているという前提でガイドいたします！
※ もしもGoogleアナリティクスをGoogleタグマネージャーで連携されている場合には、 直接gtagを使うことができませんのでこちらの記事などを参考にGTMのdatalayerを使ってイベント連携ができます！https://qiita.com/ybiquitous/items/4083fa1c1bf163c07f4c
チャネルトーク問い合わせ発生イベントのdatalalyerコード(参考用)
•
設定方法
1.
トリガーを作成しましょう
まずは新規作成ボタンをクリック
その後ページ閲覧時をトリガーにして、保存
"一部のページビュー"を選択してフィルタリングすれば、特定のページだけターゲティングすることもできます！
2. タグを作成しましょう
新規作成ボタンをクリックし、
問い合わせの開始(チャットボットや接客チャットを開始)をイベントとしてGoogleアナリティクスでトラッキングするタグを作成しましょう！
<script> ChannelIO('onChatCreated', function() { gtag('event', '問い合わせ開始', {'event_category': 'ChannelTalk','event_label': 'onChatCreated'}); }); </script>
JavaScript
event名やevent_category、event_labelは、御社に合った任意の値を入力してください
参照：
3. 保存したあと、公開したら反映されます！
4. Googleアナリティクスでコンバージョンに繋がったかトラッキングする
行動>イベント>イベントフローにて、
セグメントの条件を特定の目標コンバージョンを達成した人をフィルタリングし、イベントフローを確認すると良いと思います！
例）
•
モバイルでも計測したい場合
上記ご案内した方法だけでは、モバイルでのコンバージョン計測ができない仕様となっております！（モバイルは別タブでチャネルトークが開くため）
•
上記で連携がうまくいかない場合は？
Shopifyアプリでチャネルトークをインストールした場合やGTMを使わずに直接Google Analyticsに連携する場合は、以下のコードもお試しください！
<script> var ch_interval = setInterval(function () { if (window.ChannelIO) { clearInterval(ch_interval); window.ChannelIO('onChatCreated', function (url) { gtag('event', '問い合わせ開始', { 'event_category': 'ChannelTalk', 'event_label': 'onChatCreated' }); }); } }, 3000); </script>
JavaScript
gtagが使えず、gaタグをご利用中の場合は、以下をお試しください！
<script> var ch_interval = setInterval(function () { if (window.ChannelIO) { clearInterval(ch_interval); window.ChannelIO('onChatCreated', function () { ga('send', 'event', '問い合わせ開始', 'ChannelTalk', 'onChatCreated'); }); } }, 3000); </script>
JavaScript
大変恐縮ながら、GTMは外部サービスのため、正確でない情報をお伝えすることのないように、弊社でサポートは行っておりませんのでその点のみご了承くださいませ
Made with