Messengerをウェブサイトにインストールするのは数分で完了します。インストール後は、顧客を歓迎し、オンボードし、サポートして、アプリの忠実なusersに育てることができます。
Messengerを完全かつ安全にインストールするために必要な2つの手順は次のとおりです：
Messengerをインストールするには、Intercomのトライアルまたはサブスクリプションが必要です。
ウェブ上のusers向けの初期Messengerインストール
まず設定 > チャネル > Messenger > インストールに移動し、ウェブ用にインストールを選択します。
Messengerのインストール方法を選択する
以下のいずれかの方法を選んで、どのようにインストールするか選択してください：
コードスニペット
React
Angular
Vue
Ember
WordPress
Google Tag Manager
Shopify
Segment
各方法を選択すると、具体的な手順が表示されます。多くの方法で、インストールを簡単にするためにNPMパッケージでのインストールが提供されています。
開発者に手伝ってもらう（任意）
必要であれば、チームメイト（エンジニアなど）にインストールを依頼できます。単にチームメイトを招待をクリックしてください。
メールアドレスを入力すると、チームのワークスペースに参加できる招待メールが送信されます。
招待されたチームメイトにはAdvanced / Expertプランではライトシートが、Essentialプランではフルシートが付与されます。彼らにはMessengerをインストールするために必要な最低限の権限が与えられます：
一般とセキュリティ設定を管理できる
Messenger設定を管理できる
ワークスペースデータを管理できる
自分でインストールする
インストール方法としてコードスニペット、React, Angular, Vue, EmberまたはShopifyを選択した場合、次の対象のどちらかを自分で完了するか選べます：
ログインのあるusers向け - ログインしているusers向けにMessengerをインストールします。Messengerは顧客名やデバイスを跨いだ過去の会話などの情報を表示します。
ログインのないウェブサイト訪問者向け - ログインしていない匿名の訪問者向けにMessengerをインストールします。会話はクッキー経由でブラウザに保存されます。
usersと訪問者の両方にMessengerをインストールすることをお勧めします。
次に「Messengerへの接続を有効にする」を行う必要があります。
重要： これが無効になっていると、Intercomへのすべてのリクエストが失敗します。Messenger APIはデフォルトで有効になっていません。Messengerインストールページに初めて移動すると、トグルを有効にするまでコード例がグレー表示されているのが確認できます。これによりワークスペースのMessenger APIがオンになり、トラフィックの受け入れを開始します。ユーザートラフィックを扱うにはこれを有効にする必要があります。
Messengerの設定が完了したら、JWTでの保護もおすすめします！
選択した方法でIntercomをインストールする
選択した方法に従って指示に従ってください。例えば、WordPressを選択した場合、この方法の指示が下に表示されます。
コードスニペット、React, Angular, Vue, またはEmberの方法を選択した場合、コードスニペットをコピー＆ペーストするためのNPMパッケージが提供されます。このスニペットはあなたの一意のワークスペースIDで事前に埋められているため、すぐに使えます。
また、パッケージはNPMサイトで直接見つけることができます。
Node.js/Rails (Ruby)/Django (Python 3) や PHP アプリにコードスニペットを含めるなど、いくつかのテンプレートが利用できます。シングルページアプリにスニペットを含めたり、rails gemを使用してスニペットをインストールすることもできます。SPAについては、その動的性質に対処するためにSPAインストールガイドに従ってください。
コードをコピーして、Messengerを表示したい各ページの</body>タグの前に貼り付けてください。
次に、現在ログインしているユーザーのメールアドレスまたはuser_idと登録日をIntercomに送信するようにコードを編集します。
コードを追加した後、アプリを開くとMessengerが表示されます。
ユーザーログアウト時にセッションを終了する
ユーザーがログアウトしたときに会話をクリアするために、Intercomのシャットダウンメソッドも呼び出すようにしてください。
共有のコンピューターとブラウザを誰かと使用する場合、クッキーが期限切れになるまで最後にログインしたユーザーの会話履歴が表示される可能性があります。そのため、ユーザーのセッションが終了したときに（手動または自動でログアウトすることで）Intercomを適切にシャットダウンすることが非常に重要です。
重要:
user_idまたはメールアドレスのいずれかでusersを識別できます。
user_idとメールアドレスの両方を送信した場合、usersの識別ではuser_idが優先されます。
user_idを使用することを選択した場合でも、メールアドレスはIntercomでusersを識別するために引き続き使用できるため、本人確認の有効化をお勧めします。
Intercomにusersに関するカスタム属性を送信することもできます。
ウェブページで
zoomのCSSを使用している場合、Intercomのウィジェットが影響を受けないようにしてください。現在ログインしているユーザーの
user_id、email、およびuser_hashは常にサーバーから動的に渡し、スニペット内に単一ユーザーのIDをハードコードしたりキャッシュしたりしないでください。訪問者がログアウトしている場合は、これらのフィールドを完全に省略して、別のuserとして識別されるのではなく匿名の訪問者として追跡されるようにしてください。
外観と操作感のオプション
最初のオプションでは、ローンチ前にウェブサイトの対象に対してMessengerを表示するか非表示にするかを選択できます。そうでなければ、デフォルトでMessengerが表示されます。
2番目のオプションはMessenger設定へのリンクで、そこでメッセンジャーの色やテーマを変更できます。
インストールを確認する
インストールを確認をクリックして、インストールが成功したかどうかを確認できます。このボタンはMessengerが正常に見つかった場合に成功通知を表示するか、何か問題があるかを示します。
Intercom Messengerをインストールしたが正しく表示されない場合、いくつかの一般的な修正方法があります。追加のトラブルシューティングでは、広告ブロッカーやプライベートブラウズなどMessengerをブロックするブラウザ制限の確認や、適切な表示を確保するためにパブリックサフィックスドメインを避けることが含まれます。
次に進んで、インストールの次のステップでMessengerをJWTで保護してください。
注： Messengerセキュリティがない場合、usersはMessengerで直近14日分の会話履歴しか表示されません。詳細 →
次を学ぶ：
クライアント向けに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,
name: "Jane Doe", // Full name
email: "customer@example.com", // Email address
created_at: 1312182000 // Signup date as a Unix timestamp
};
</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>
created_atの値は、顧客がアプリ、サイト、またはサービスに登録した日付で、Unixタイムスタンプとして送信してください。
EUおよびAUでホストされているワークスペースへのIntercomのインストール
EUまたはAUのホスティングを使用している場合は、追加のapi_baseパラメータを指定する必要があります。これらの値は以下の表に記載されています。
データホスティング地域 |
|
アメリカ合衆国 (US) | |
欧州連合 (EU) | |
オーストラリア (AU) |
デスクトップ環境にIntercomをインストールする
技術的にはデスクトップアプリにIntercomを組み込むことは可能ですが、公式にはデスクトップ環境はサポートしていません。 Intercom Messengerはウェブ環境で動作するように設計されています（サポートされているブラウザの一覧）。これらのウェブ環境は、Messengerが依存する特定のウェブ機能（例：JavascriptやCSS）をサポートします。
Electronなどの技術を使えばウェブ技術でデスクトップアプリを構築でき、Intercomをこれらのアプリにインストールすることは可能です。コミュニティライブラリ（例：Electron環境へのIntercomインストール）もありますが、公式サポートはしていません。