[Other] Installing SDK & Widgets on website

[Other] Installing SDK & Widgets on website

This article talks about the steps required for installing SDK and adding widgets on your website.

Installing Morph.ai SDK

You can install Morph.ai plugin on your website by adding the following code at the end of the body tag of your page. Placing it at the end allows your website to load first.

<script src="https://app.morph.ai/livechat/morph.js"></script>
<script>Morph.init({'appToken': '<YOUR-APP-TOKEN>'});</script>

Are you already using any Facebook SDK's on your website?

In case you are already using any Facebook plugins like - FB Share Plugins, FB Pixel, FB Like us buttons etc, please do make sure you whitelist your website Urls on your Facebook app. Please find the steps below to whitelist your website on your Facebook app.
  1. Go to https://developers.facebook.com/
  2. Select your Facebook app that you are using on the website.
  3. Go to Facebook login > Settings
  4. Add our website url in 'Valid OAuth Redirect URLs'
  5. Save changes

Adding Widgets

Checkbox

What is a checkbox?

The checkbox plugin allows you to display a checkbox in forms on your website that allows users to opt-in to receive messages from your bot in Messenger. For example, you could include the plugin on an e-commerce website, where you wish to send receipts and order updates to the user.
For more details refer to the link - Click here

How to add checkbox?

To add checkbox, please add the following code above the button of the form which performs the submit action of the form.

<div class="mw-embed" data-id="<WIDGET-ID>" data-ref-params="<REFERRAL-TO-USE>" data-user-ref="<USER-ID>"></div>
To show the checkbox call the following function from javaScript, once the above HTML is loaded to the DOM (Document Object Model)

Morph.parse();
On form submit, call the given Opt-in function as below.

Morph.confirmOptIn('<WIDGET-ID>');

    • Related Articles

    • 4.05 How to use Live chat?

      What is Morph Messenger (Website Live Chat)? Live chat is a tool to engage, support and retain customers and provide real-time assistance to website visitors. Many business owners see live chat as yet another tool, just like email or phone, that can ...

    • [Configure] Source

      Morph.ai platform provides multiple ways for you to bring the user to the bot- Facebook ads, Email/SMS campaigns or Google ads. Based on the source, the platform provides you multiple widgets for attracting new customers and communicating with your ...

    • [WhatsApp] How to build WhatsApp chatbot

      Morph.ai is a chat based intelligent automation tool that helps business to interact with their customers directly. It is an integrated set of modules and analytics that help you manage the entire customer journey. Creating a bot on the Morph ...

    • [Facebook] How to build a Lead Generation Chatbot

      Are you a small-business owner and want to increase your lead count by using personalised interactions to improve user engagement and drive sales at scale? Are you looking to bring your targets from ads on multiple platforms to an engaging automated ...

    • 4.01 How to test your bot and Go live - Introduction

      Once all the conversation flows have been created and workflows have been defined, you are ready to deploy your bot and test out the flows just to be sure that all the conversations are working fine and the user details collected have been saved ...