Revision as of 15:32, March 27, 2019 by Jokane (talk | contribs)
Jump to: navigation, search

Facebook Messenger

This page explains how to create a structured message for Facebook Messenger. It also documents the various types of messages you can send to customers.

Creating a structured message for Facebook Messenger

Important
See the Facebook developer documentation for more information on using structured messages with Facebook Messenger.
  1. Create a standard response.
  2. Go to the Structured Body tab (formerly the HTML tab).
  3. Select Structured.

    4. ES ESMgr853 InteractiveSR3.png

  4. In the Media Origin menu, select Facebook.
  5. In the Type menu, select one of the following types:
    • Button—Send a text message with up to three attached buttons.
    • Generic—Send a simple structured message that includes a title, subtitle, image, and up to three buttons.
    • List—Send a list of two to four structured items with an optional global button rendered at the bottom.
    • Media—Send images, GIFs, and video as a structured message with an optional button.
    • Open Graph—Send a structured message with an Open Graph URL, plus an optional button.
  6. Click Edit JSON to configure the media type. Depending on which type you selected, eServices Manager might prompt you to save the standard response before you can edit it.
  7. Optionally, you can directly edit the JSON associated with the media type in the provided field, or click Open File to load a JSON file from your local machine. See Adding attachments after uploading JSON for additional information.
  8. Optionally, add field codes.
    9. Important
    You must not use double-quotation marks (") for field codes that are used in structured messages. Use single quotation marks (') instead.
  9. Click Create.
Important
If you want to change the Media Type after you have saved a structured message, you must first delete the previous origin and type. ES ESMgr853 InteractiveSR4.png

Button

This option allows the customer to select from up to three buttons. For example, the buttons could be options in response to a question. See the Facebook developer documentation for more information.

You can configure the following options:

Button tab

  • Title—In the text box, enter a title that will appear above the button.
  • Sharable—If checked, the customer can share this structured message with other users.
  • Add Button—Click to add the button. You can select the following options:
    • Call—Provide a name and phone number that the customer can call.
    • Postback—Send an event that can trigger an action on an external website.
    • URL—Provide a link that the customer can click.

ES ESMgr853 FBButton1.png

Preview tab

View a preview of how the media type you created will appear to the customer.

JSON tab

View the JSON associated with your media type.

Generic

This option provides a simple structured message that includes a title, subtitle, image, and up to three buttons. You can also specify a default_action object that sets a URL to open when the message is selected. See the Facebook developer documentation for more information.

You can configure the following options:

Generic tab

  • Sharable—If checked, the customer can share this structured message with other users.
  • Elements—Click + to add a new element. You must have a minimum of one element in the message, up to a maximum of 10 elements. You can configure the following options of an element:
    • Title—Enter a title for the element.
    • Subtitle—Enter a subtitle for the element.
    • Image URL—Displays the URL to the image associated with this element. This field is generated automatically after you upload the image. If you manually uploaded the JSON for this element, see Adding attachments after uploading JSON for additional information.
    • Add Image button—Click to open the Edit Attachments window and upload an image for this element. See Supported file types.
    • Add Button—Click to add a button. You can select the following options:
      • Call—Provide a name and phone number that the customer can call.
      • Postback—Send an event that can trigger action on an external website.
      • URL—Provide a link that the customer can click.
    • Default Action—Opens a URL inside Facebook Messenger (webview) when the message is selected. If checked, you can configure the following options:
      • URL—Enter the URL to open when the message is selected.
      • Webview Height Ratio—Set the height of the website window when it is opened in Facebook Messenger.
      • Messenger extensions—If checked, provide aFallback URLfor Messenger to open after the webview is complete.
      • Share Button—Select whether toshoworhidethe share button in Facebook.
  • Image Aspect Ratio—Select either horizontal (1.91:1) or square (1:1). This setting determine how the picture appears in the element. Pictures that do not use the correct aspect ratio will be scaled or cropped.

You can add additional elements by clicking + and configuring the options described above for the new element. To rearrange the order of elements, click the arrow buttons.

ES ESMgr853 FBGeneric1.png

Preview tab

View a preview of how the media type you created will appear to the customer.

JSON tab

View the JSON associated with your media type.

List

This option provides a list of two to four structured items with an optional global button rendered at the bottom. Each item may contain a thumbnail image, title, and subtitle. You can also specify a default_action object that sets a URL to open when the message is selected. See the Facebook developer documentation for more information.

You can configure the following options:

List tab

  • List Common Button—Click Add Button to add a common button that appears below the list items. You can select the following options:
    • Call—Provide a name and phone number that the customer can call.
    • Postback—Send an event that can trigger action on an external website.
    • URL—Provide a link that the customer can click.
  • Sharable—If checked, the customer can share this structured message with other users.
  • Elements—Click + to add a new element. You can configure the following options of the element:
    • Title—Enter a title for the element.
    • Subtitle—Enter a subtitle for the element.
    • Image URL—Displays the URL to the image associated with this element. This field is generated automatically after you upload the image. If you manually uploaded the JSON for this element, see Adding attachments after uploading JSON for additional information.
    • Add Image button—Click to open the Edit Attachments window and upload an image for this element. See Supported file types.
    • Add Button—Click to add a button. You can select the following options:
      • Call—Provide a name and phone number that the customer can call.
      • Postback—Send an event that can trigger action on an external website.
      • URL—Provide a link that the customer can click.
    • Default Action—Opens a URL inside Facebook Messenger (webview) when the message is selected. If checked, you can configure the following options:
      • URL—Enter the URL to open when the message is selected.
      • Webview Height Ratio—Set the height of the website window when it is opened in Facebook Messenger.
      • Messenger extensions—If checked, provide aFallback URLfor Messenger to open after the webview is complete.
      • Share Button—Select whether toshoworhidethe share button in Facebook.
  • Image Aspect Ratio—Select either large (cover style) or compact (list style). This setting determine how the picture appears in the element.

ES ESMgr853 FBList1.png

Preview tab

View a preview of how the media type you created will appear to the customer.

JSON tab

View the JSON associated with your media type.

Media

This option allows you to send images, GIFs, and video as a structured message with an optional button. Videos and animated GIFs sent with the media template are playable in the conversation. See the Facebook developer documentation for more information.

You can configure the following options:

Media tab

  • Sharable—If checked, the customer can share this structured message with other users.
  • Media Type—Select whether to attach an image or video above the button.
  • Attachment URL—Displays the URL to the media associated with this button. This field is generated automatically after you upload the media. If you manually uploaded the JSON for this element, see Adding attachments after uploading JSON for additional information.
  • Add Media button—Click to open the Edit Attachments window and upload media for this button. See Supported file types.
  • Add Button—Click to add a button. You can select the following options:
    • Call—Provide a name and phone number that the customer can call.
    • Postback—Send an event that can trigger action on an external website.
    • URL—Provide a link that the customer can click.

ES ESMgr853 FBMedia1.png

Preview tab

View a preview of how the media type you created will appear to the customer.

JSON tab

View the JSON associated with your media type.

Open Graph

This option allows you to send a structured message with an Open Graph URL, plus an optional button. Currently, only sharing songs is supported. The song will appear in a bubble that allows the message recipient to see album art and preview the song. See the Facebook developer documentation for more information.

You can configure the following options:

Open Graph tab

  • Attachment URL—Enter the Open Graph URL. The URL must provide Open Graph-formatted song details.
  • Add Button—Click to add a button. You can select the following options:
    • Call—Provide a name and phone number that the customer can call.
    • Postback—Send an event that can trigger action on an external website.
    • URL—Provide a link that the customer can click.

ES ESMgr853 FBOpenGraph1.png

Preview tab

View a preview of how the media type you created will appear to the customer.

JSON tab

View the JSON associated with your media type.

Comments or questions about this documentation? Contact us for support!