Messengerをウェブサイトにインストールするのに数分しかかかりません。インストール後は、訪問者やleadsを迎え入れ、チャットし、顧客に変換できます。
訪問者/leads と Users
ウェブサイトの訪問者はMessengerを通じてコミュニケーションを取るとleadsになり、Usersはウェブサイトやアプリにログインしています。主な違いは彼らについて知っている情報量です。ログイン済みUsers向けにIntercomをインストールする場合は、こちらのガイドを使用してください。
Messengerをインストールするには、Intercomのトライアルまたはサブスクリプションが必要です。
ウェブ上の訪問者とleads向けのMessenger初期インストール
インストール方法を選ぶ前に、ウェブサイトの要件を考慮してください：
すべての訪問者がMessengerにアクセスできる標準的なウェブサイト - ログイン済み・未ログインの訪問者両方にMessengerを提供したい場合に選択してください。
Messengerアクセスをログイン済みUsersのみに制限した標準的なウェブサイト - 認証済みUsersのみにMessengerアクセスを制限したい場合に選択してください。
シングルページアプリケーション（SPA）インストール - ウェブサイトがシングルページアプリケーションとして構築されている場合にこの特定の方法を使用してください。
まず設定 > Messenger > インストールに移動し、ウェブ用にインストールを選択してください。
Messengerのインストール方法を選択する
以下の方法のいずれかを選んでインストール方法を決めてください：
コードスニペット
React
Angular
Vue
Ember
WordPress
Google Tag Manager
Shopify
Segment
各方法を選択すると具体的な手順が表示されます。多くの方法はnode package manager（NPM）インストールを提供し、より簡単に行えます。
開発者に手伝ってもらう（任意）
必要に応じて、チームメイト（エンジニアなど）にインストールを依頼できます。チームメイトを招待をクリックしてください。
メールアドレスを入力すると、チームのワークスペースに参加できる招待メールが送信されます。
招待されたチームメイトはAdvanced / Expertプランではライトシート、Essentialプランではフルシートが付与されます。Messengerインストールに必要な最低限の権限が与えられます：
一般設定とセキュリティ設定を管理できる
Messenger設定を管理できる
ワークスペースデータを管理できる
自分でインストールする
インストール方法にコードスニペット、React、Angular、Vue、EmberまたはShopifyを選択した場合、ログインなしのウェブサイト訪問者向けにIntercomをインストールする選択肢があります。
Usersと訪問者の両方にMessengerをインストールすることを推奨します。
選択した方法でIntercomをインストールする
選択した方法の指示に従ってください。
コードスニペット、React、Angular、Vue、またはEmberの方法を選択した場合、NPMパッケージが提供され、コードスニペットを自分のアプリのコードベースにコピー＆ペーストできます。このスニペットはあなたのユニークなワークスペースIDで事前設定されているので、すぐに使えます。
パッケージはNPMサイトでも直接見つけられます。
Basic JavaScriptやSingle-page appにコードスニペットを含めるなど、他にもいくつかのテンプレートがあります。また、Rails gemを使ってスニペットをインストールすることも可能です。
コードをコピーして、Messengerを表示したいすべてのページの</body>タグの直前に貼り付けてください。
コードを追加したら、訪問者としてウェブサイトを表示するとMessengerが表示されます。
ウェブページでzoom CSSを使用している場合、Intercomのウィジェットが影響を受けないようにしてください。
見た目と操作感のオプション
最初のオプションは、Messengerをウェブサイトの訪問者に表示するか非表示にするかを選べます。指定しなければデフォルトで表示されます。
2つ目のオプションはMessenger設定へのリンクで、色やテーマを変更できます。
インストールを確認する
インストールを確認をクリックして、インストールが成功したか確認できます。成功すると通知が表示され、問題があれば知らせてくれます。
Intercom Messengerをインストールしたのに正しく表示されない場合は、いくつかの一般的な解決方法をご覧ください。
使い方を学ぶ：
クライアント向けにIntercomをインストールする
Intercomワークスペースにアクセスできない場合は、ここでJavaScriptコードを取得できます👇 WORKSPACE_IDをあなたのIntercomアカウントのユニークなワークスペースIDに手動で置き換える必要があります。
<script>
var APP_ID = "WORKSPACE_ID"; // Replace this with your workspace ID
window.intercomSettings = {
app_id: APP_ID
};
</script>
<script>(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/' + APP_ID;var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})();</script>
EUおよびAUホスティングのワークスペース向けIntercomインストール
EUまたはAUホスティングを使用している場合、追加のapi_baseパラメータを提供する必要があります。値は以下の表に記載されています。
データホスティング地域 |
|
アメリカ合衆国（US） | |
欧州連合（EU） | |
オーストラリア（AU） |
一般的なトラブルシューティング手順
Messengerがウェブサイトに表示されない場合、以下の一般的なトラブルシューティング手順で問題の診断に役立ててください。
1. インストールを確認する
まずMessengerのJavaScriptスニペットまたは選択したプラグインが正しくインストールされているか確認してください。JavaScriptスニペットを使用している場合は、ウェブサイトの閉じる</body>タグの直前に配置されていることを確認してください。
2. 信頼できるドメインを確認する
ワークスペースの設定 > セキュリティ > 信頼できるドメインでウェブサイトのdomainが正しく設定されていることを確認してください。domainがリストにない場合、Messengerは読み込まれません。
3. 身元確認を見直す
身元確認を有効にしている場合は、正しく設定されているか確認してください。誤設定は403エラーを引き起こし、Messengerがウェブサイトに読み込まれない原因になります。
4. 広告ブロッカーやプライベートブラウジングを無効にする
広告ブロッカーやプライベートブラウジングモードなどのブラウザ機能や拡張機能はMessengerの動作を妨げることがあります。Messengerが表示されるか一時的に無効にして確認してください。
注意：身元確認は追加のセキュリティ対策です。強制されているがウェブサイトで正しく設定されていない場合、403エラーが発生する可能性があります。