Web Tools

Use web tools to promote your Facebook Messenger bots through Facebook and elsewhere on the web. You will need to have a Facebook Messenger bot set up in order to use web tools.

  1. To get started hit the ‘+ New’ button at the top of the screen.
  2. Choose the Facebook Messenger bot you want to promote
  3. Choose the web tool you want to create

Overview

  • Button - Generate a button that allows the user to opt-in to receive messages from you through Facebook Messenger.
  • Link - Generate a unique URL that redirects users to your Facebook Messenger bot.
  • Facebook Ads JSON - Generate code to include in your Facebook Ad to connect users directly to your Facebook Messenger bot.
  • Facebook Comments - Auto reply to comments posted on your Facebook Page with a direct message.
  • Messenger Code - Generate a unique Messenger Code to embed in a website or for print.

Button

Create a ‘Send to Messenger’ button to add to your website. You can add the button anywhere you like on your site. When the user clicks the button they are taken directly to your Facebook Messenger bot.

  1. Choose an appropriate name for your button. It is ‘Button’ by default.
  2. Choose either Blue or White for the button color. These are standard Facebook buttons.
  3. Choose the size of your button.
  4. The preview on the right shows what your button would look like in both desktop and mobile views.
  5. If you want to trigger a specific flow after the user clicks the button, add the trigger word or phrase. For example, you may want to acknowledge that the user came from your website e.g. start the flow with a message that says “Thanks for visiting my site...”.
  6. Click next to generate the embed code that you need to insert into your website.

Link

This web tool generates a reference URL that links your users directly to your Facebook Messenger bot.

  1. Choose an appropriate name for your web tool. The default is ‘Link’.
  2. If you want to trigger a specific flow after the user clicks the link, add the trigger word or phrase. For example, you may want to acknowledge that the user came from your website e.g. start the flow with a message that says “Thanks for visiting my site...”.
  3. Click next to generate the embed code that you need to insert into your website.

Facebook Ads JSON

If you use Facebook advertising to promote your Messenger bot, you can generate unique JSON code to use in your ads to directly link them to your bot.

  1. Choose an appropriate name for your web tool. The default is ‘Facebook Ads JSON’.
  2. Type a message that the user will see when they are directed to your Facebook Messenger bot. This should be related to the advert they interacted with.
  3. Specify the button text that the user will typically respond with. This needs to be inviting and relate to the advert and message.
  4. If you have a number of different ads, you may want to create a web tool for each advert in order to maintain context for your users, changing the welcome message and button text.
  5. If you want to trigger a specific flow after the user clicks the button, add the trigger word or phrase. For example, you may want to acknowledge that the user came from a specific advert.
  6. Click next to generate the unique JSON code to use in your Facebook Ad.

To embed your code you need to find the relevant area in Facebook:

  1. Open Facebook Ads.
  2. Choose ‘Structured Message (JSON).
  3. Click ‘edit’.
  4. Paste your unique JSON code into the ‘JSON Creation’ tab.

Facebook Comments

If you create a post on your Facebook Page and a user comments on your post, you can set your bot to automatically send that user a message through Facebook Messenger using the Facebook Comments Web Tool.

  1. If you have not already done so connect to Facebook by hitting the blue Facebook button. Once connected this will enable the other fields in the Settings panel.
  2. Enter an applicable name for your web tool. The default is ‘Facebook Comments’.
  3. Enter the unique url for your Facebook Page post. To get this, find the timestamp on the post (10 hrs, 14 mins, etc.), click the link, then copy the URL from the address bar.
  4. Enter the message you want to automatically send to anyone who comments on your post.
  5. If you want to filter which users receive the automatic message you can enter as many keywords or phrases as you like. If the user’s comment contains any of these, the message will be sent.
  6. Note - the preview shows ‘Your post’ as a button in Messenger. This changes to the title of your post.

Finding the Facebook Post URL

The method you'll need to use is slightly different depending on the type of post. Click on the timestamp (10 hrs, 14 mins, etc.) just below the page/user name at the top of the post.

Standard Posts

If you see the post itself again with a URL that contains the word 'permalink':

  1. Copy the URL from your browser's address bar.
  2. Paste that URL into the 'Facebook Post URL or ID' field in Flow XO.
Photo Posts

If you see the photo viewer, then you'll need to use a different method to get the post's URL (close the photo viewer and follow these steps):

  1. Open the '...' menu at the top right of the post.
  2. Click 'Embed'.
  3. Click 'Advanced settings'.
  4. A new page will load up titled 'Code Generator'. Copy the URL from the 'URL of Post' field.
  5. Paste that URL into the 'Facebook Post URL or ID' field in Flow XO.

Messenger Code

Use this web tool to generate a unique Messenger Code to use either digitally or for print. When the user interacts with the code they will be taken directly to your Facebook Messenger bot.

  1. Choose an appropriate name for your web tool. The default is ‘Messenger Code’.
  2. Choose the image size in pixels. The minimum size is 100px square, the maximum is 2000 pixels square.
  3. If you want to trigger a specific flow after the user interacts with the Messenger Code, add the trigger word or phrase. For example, you may want to acknowledge that the user came from the code used on a specific campaign.
  4. Click next to generate the Messenger Code.
  5. Download the image.

Facebook Customer Chat

Generate a Facebook Customer Chat tool to include on your website, enabling visitors to your site to access your Facebook Messenger bot directly.The Facebook icon and window appears in the bottom right of your web page.

  1. Choose an appropriate name for your web tool. The default is ‘Facebook Customer Chat’.
  2. Choose how you want the chat window to appear when a user first visits your site.The default is open on desktop, and minimized on mobile.
  3. If you want to trigger a specific flow after the user interacts with the Facebook Customer Chat window, add the trigger word or phrase. For example, you may want to welcome the user to your website.
  4. Click next to generate the code for your website.
  5. Hit the link at the top of the launch panel to open your Facebook Page settings. You need to add your domain to the Whitelisted Domains section.Please include any variations of your domain.
  6. Copy and paste the Install Script into your website before the closing body tag.
  7. Copy and paste the embed code anywhere into the body of the web page.

Let us know how we can improve Flow XO on our feedback site.

Still need help? Contact Us Contact Us