# Facebook Messenger Widgets

# Persistent Menu

widget

For Facebook bots, you can have a persistent menu with 3 buttons at most. To setup:

  1. go "Tools" from the left sidebar
  2. click "Persistent Menus"
  3. "Edit Menu"
  4. "+ Add Menu"
  5. give menu title
  6. select a menu type, "Goto sub flow", "Open website" or "Open checkout page"
  7. choose a sub flow or name a website address

widget

Here is where you find your persistent menu when you talk to the bot:

widget

# Widgets

widget

For Facebook bots, you can set some widgets to quickly start talking to the bot. To setup:

  1. go "Tools" from the left sidebar
  2. click "Widgets"
  3. "+ New Widget"

# Messenger Ref URL Widget

widget

  1. put a widget name
  2. choose a sub flow the link goes to

(leave 3 and 4 blank if no reference is needed)

  1. put a parameter name
  2. assign a custom user field

What does the Ref parameter do?

For instance, you make a messenger ref URL to your main flow, so that by visiting this URL, your users can start talking to your bot.

However, you would like to gather more information from the link, like where did your users get the link? In this case, you can put "source" in area 3 and a variable to store the source at area 4 in the above picture.

Later, add a source name in your link according to where do you put it. This is how you get extra information from the link.

After filling in all the information, click "Save" and click the pencil to edit this widget, you will see a unique URL generated for this widget:

widget

So here, by visiting any of the following links, your users can start talking to your bot:

example link value in variable "source"
https://m.me/102942588321862?ref=source
https://m.me/102942588321862?ref=source--advertisement advertisement
https://m.me/102942588321862?ref=source--shared_by_users shared_by_users
https://m.me/102942588321862?ref=source--promoted_by_sales promoted_by_sales

Yes, you might notice that by adding "--xxx" after the link, the value "xxx" will be transferred to the bot.

# QR Code Widget

URL links are convenient to click via electronic way while QR codes are more suitable for on-site use. By scanning a QR code, your users can start talking to your bot.

widget

To setup:

  1. give a widget name
  2. select a sub flow
  3. upload your logo image
  4. adjust image size if needed
  5. adjust color if needed
  6. adjust dot scale if needed
  7. click "Generate" to get an image on the right. Repeat step 4, 5 and 6 to get a final image
  8. download your QR code, print it and put it in your store, restaurant, office, etc

# Customer Chat Widget

widget

This widget is to be embedded on your website, so that your website can have a bot serving users as uchat.com.au do:

widget

To setup:

  1. give a widget name
  2. select a sub flow
  3. adjust theme color if needed
  4. adjust greeting message which will be shown above the "Continue as xx" button (see in the previous picture).
  5. select a display type
  6. adjust the delay if the second or the third display type is selected
  7. for payload, see explanation in Messenger Ref URL above.

Click "Save" after finishing all the settings, again, click the pencil to edit this widget and you will see this button:

widget

Click it.

widget

Add the websites that you want to put this bot at. Then install the snippet by copying and pasting the code.

Perfect! 😎 You got a bot on your website now.

widget

# Greeting Text

Greeting text will be shown before users' interaction.

To setup:

widget

Click "Settings" from the left sidebar, put your greeting text and click "Save". That's it!

Note

Only the owner of this account can see the "Settings" option.

This is how it looks like on the user side:

widget

Last Updated: 4/20/2021, 4:13:19 AM