ウェブプラグインのリファレンス

Messengerプラットフォームには、ウェブサイトを訪れる利用者とのスレッドを簡単に始められる、一連のウェブプラグインが用意されており便利です。すべてのプラグインは、JavaScript用Facebook SDKで実装されます。

内容

カスタマーチャットプラグイン(ベータ)

Messengerプラットフォームのカスタマーチャットプラグインを使うと、Messengerボットを直接ウェブサイトに統合できます。これによりカスタマーは、Messengerと同様のパーソナライズされたリッチメディアエクスペリエンスで、ビジネスといつでもやり取りできるようになります。

使用方法について詳しくは、カスタマーチャットプラグインをご覧ください。

Includeフォーマット

<div class="fb-customerchat"
 page_id="<PAGE_ID>">
</div>

属性

属性 説明

class

文字列

値はfb-customerchatにする必要があります。

page_id

文字列

ページID

ref

文字列

任意。messaging_postbacksイベントとmessaging_referralsイベントでWebhookに渡すカスタム文字列。

theme_color

文字列

任意。カスタマーチャットプラグインアイコンの背景色やユーザーが送信するメッセージの背景色などを含む、プラグインのテーマとして使用する色。先頭に番号記号が付いた16進数のカラーコード(白を除く)がサポートされています(例: #0084FF)。白とのコントラストが高い色を選ぶことを強くおすすめします。

logged_in_greeting

文字列

任意。ユーザーがFacebookにログインしている場合に表示されるあいさつメッセージ。80文字以内。

logged_out_greeting

文字列

任意。ユーザーがFacebookにログインしていない場合に表示されるあいさつメッセージ。最大80文字。

greeting_dialog_display

文字列

任意。あいさつダイアログの表示方法を決定します。サポートされている値は次のとおりです。


  • show: あいさつダイアログは、プラグインの読み込み時に毎回表示されます。
  • fade: プラグインのあいさつダイアログは、表示されたあとにフェードアウトし、その後は非表示になります。
  • hide: プラグインのあいさつダイアログは、利用者がプラグインをクリックするまで非表示になります。

デフォルトは、デスクトップの場合はshow、モバイルの場合はhideです。

greeting_dialog_delay

文字列

任意。プラグインの読み込み後にあいさつダイアログが表示されるまでの秒数を設定します。この設定を使用して、あいさつダイアログが表示されるタイミングをカスタマイズできます。

minimized

ブーリアン

廃止のお知らせ

この属性は廃止されました。プラグインをカスタマイズする場合は、代わりにgreeting_dialog_displayをご使用ください。greeting_dialog_delay属性はminimized属性より優先されます。

任意。

  • true: trueに設定すると、greeting_dialog_delay = "fade" に設定した場合と同じ効果を持ちます。
  • false: falseに設定すると、greeting_dialog_delay = "show" に設定した場合と同じ効果を持ちます。

「メッセージでご連絡ください」プラグイン

利用者を直接Messengerのスレッドに誘導します。

使用方法について詳しくは、メッセージでご連絡くださいプラグインをご覧ください。

Includeフォーマット

<div class="fb-messengermessageus" 
  messenger_app_id="<APP_ID>" 
  page_id="<PAGE_ID>"
  color="<blue | white>"
  size="<standard | large | xlarge>">
</div>

属性

属性 HTML5属性 説明

class

文字列

値はfb-messengermessageusにする必要があります。

page_id

文字列

ページID

messenger_app_id

番号

FacebookアプリID。

color

data-color

文字列

ボタンの色: blueまたはwhite


デフォルトはblueです。

size

data-size

文字列

ボタンのサイズ: standardlargexlarge


デフォルトはlargeです。

ref

文字列

任意。messaging_postbacksイベントとmessaging_referralsイベントでWebhookに渡すカスタム文字列。

「Messengerに送信」プラグイン

バックグラウンドでMessengerボットから利用者にメッセージを送り、オプトインさせることができます。

使用方法について詳しくは、Messengerに送信プラグインをご覧ください。

Includeフォーマット

<div class="fb-send-to-messenger" 
  messenger_app_id="<APP_ID>" 
  page_id="PAGE_ID" 
  data-ref="<PASS_THROUGH_PARAM>" 
  color="<blue | white>" 
  size="<standard | large | xlarge>">
</div>

属性

属性 説明

class

文字列

値はfb-send-to-messengerにする必要があります。

page_id

文字列

ページID

messenger_app_id

番号

FacebookアプリID。

color

文字列

任意。ボタンの色: blueまたはwhite


デフォルトはblueです。

size

文字列

任意。ボタンのサイズ: standardlargexlarge


デフォルトはlargeです。

ref

文字列

任意。カスタム状態パラメーター。250文字以内で入力します。


使用できる文字はa-z A-Z 0-9 +/=-._です


セキュリティ上、エンコードと暗号化が必要です。

enforce_login

ブーリアン

任意。trueの場合、ログインしたユーザーはこのボタンをクリックしたときに、再度ログインしなければなりません。デフォルトはfalseです。

refパラメーターを使って、認証の状態を渡します。複数の場所にプラグインを表示する場合、プラグインを表示する場所ごとに状態を修正する必要がある場合があります。

チェックボックスプラグイン

チェックボックスプラグインでは、チェックアウトや登録といったフォームの一部として利用者をMessengerボットに登録します。

使用方法について詳しくは、チェックボックスプラグインをご覧ください。

Includeフォーマット

<div class="fb-messenger-checkbox"  
  origin=<PAGE_DOMAIN>
  page_id=<PAGE_ID>
  messenger_app_id=<APP_ID>
  user_ref="<UNIQUE_REF_PARAM>"
  allow_login="<true>"
  size="<small | medium | large | standard | xlarge>"
  skin="<light|dark>"
  center_align="<true|false>">
</div>

属性

属性 説明

class

文字列

値はfb-messenger-checkboxにする必要があります

page_id

番号

ボットに関連付けられているFacebookページID。

messenger_app_id

番号

FacebookアプリID。

user_ref

文字列

利用者を参照するための一意のパラメーター。250文字以内で入力します。


使用できる文字はa-z A-Z 0-9 +/=-._です

allow_login

ブーリアン

任意。また、既存のセッションがない場合は、利用者がログインできるようにします。デフォルトはtrueです。

size

文字列

任意。プラグインのサイズ: smallmediumlargestandardxlarge


デフォルトはlargeです。

skin

文字列

任意。プラグインコンテンツの配色テーマを設定します。サポートされているオプションは以下のとおりです。

  • light: プラグインは暗いテキストで表示されます。
  • dark: プラグインは白いテキスト、透明のMessengerアイコン、白い稲妻マークで表示されます。

デフォルトはlightです。

center_align

ブーリアン

任意。プラグインのコンテンツを中央揃えにするかどうかを設定します。


デフォルトはfalseです。