How to Add Facebook Messenger

Facebook Messenger for business pages helps you simplify customer acquisition and support by providing a direct, conversational way for people to contact you while on your Pagecloud site.

Create your Customer Chat through Facebook

  1. In Facebook go to your business page.
  2. On the left side of the page, under 'Manage Page' scroll down and select 'Settings'.
  3. Select 'Messaging'.
  4. In the 'Add Messenger to your website' section click 'Get Started'
  5. This will open up a business.facebook page on the 'Chat Plugin' tab.
  6. Click 'Set Up' and fill out the required information.
  7. The third step in the 'Set Up' will have you copy the embed code.

The embed you will copy will look like this example but with your own unique "page_id"


<!-- Messenger Chat Plugin Code -->

    <div id="fb-root"></div>

    <!-- Your Chat Plugin code -->

    <div id="fb-customer-chat" class="fb-customerchat">

    </div>

    <script>

      var chatbox = document.getElementById('fb-customer-chat');

      chatbox.setAttribute("page_id", "106717734932626");

      chatbox.setAttribute("attribution", "biz_inbox");

      window.fbAsyncInit = function() {

        FB.init({

          xfbml            : true,

          version          : 'v10.0'

        });

      };

      (function(d, s, id) {

        var js, fjs = d.getElementsByTagName(s)[0];

        if (d.getElementById(id)) return;

        js = d.createElement(s); js.id = id;

        js.src = 'https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js';

        fjs.parentNode.insertBefore(js, fjs);

      }(document, 'script', 'facebook-jssdk'));

    </script>

Add your Messenger Embed to your Site

  1. Open your Pagecloud Editor.
  2. Open the <body> editor through the advanced tab in page settings or with the keyboard shortcut E+B.
  3. Paste the code you generated from Facebook.
  4. Click 'Save and Close' the <body> editor.
  5. Save your Page and view live. Your Facebook messenger chat bubble will appear at the bottom left of your screen.

Tip. Customizing the Facebook widget is done through the business.facebook setup tool.

User Icon

Thank you for your feedback!

Was this article helpful?
Thank you for your feedback!