Checkbox Plugin for Facebook Messenger


You can use this plugin to send purchase updates and promotions to user's Facebook Messenger.

Steps for Facebook messenger integration:


1. Ensure that your website uses secure HTTPS protocol

Facebook requires secure HTTPS protocol, so you need to ensure that you site has SSL certificate and is accessible via HTTPS.

2. Add Omnisend JavaScript snippet to your store‘s front-end

If you haven't added Javascript snippet yet (used for Frontend API, forms, etc.) add it right before the </body> tag of all your pages.

Javascript snippet code:

<script type=" text/javascript">
//OMNISEND-SNIPPET-SOURCE-CODE-V1
window.omnisend = window.omnisend || [];
omnisend.push(["accountID", "<YOUR_ACCOUNT_ID>"]);
!function(){ var e=document.createElement("script");e.type= "text/javascript",e.async=!0,e.src= "https://omnisrc.com/inshop/launcher.js"; var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)}();
</script>

Replace <YOUR_ACCOUNT_ID> with your accountID, which you can find in app.omnisend.com panel, Integrations & API part.

Read more about Frontend API and snippet in our API Reference

3. Connect Facebook Messenger app

Go to Omnisend account and connect Facebook Messenger app in Connected Apps

4. Enable at least one automation flow with Facebook Messenger block

Go to Omnisend account and enable at least one automation flow with Facebook messenger: Abandoned Cart, Order Confirmation and/or Shipping Confirmation.

5. Add omnisend-add-to-cart-button class to "Add to cart" button in product page.

Add omnisend-add-to-cart-button class to "Add to cart" button in product page. We'll hook event listener to this element and subscribe user to Facebook Messenger if needed.

Code example:

<button type="submit" name="add-to-cart" class="single_add_to_cart_button button alt omnisend-add-to-cart-button">Add to cart</button>

Note: if you don't use omnisend-facebook-messenger-checkbox-container class (see next step) we'll add Facebook messenger checkbox after "Add to cart" (element with class omnisend-add-to-cart-button) button.


6. (Optional) Add omnisend-facebook-messenger-checkbox-container class to element

Add omnisend-facebook-messenger-checkbox-container class to element in product page to which Facebook messenger checkbox will be prepended (inserted above it).

Code example:

<input type="number" name="quantity" value="1" size="4" class="input-text qty text omnisend-facebook-messenger-checkbox-container"></button>

Note: if you don't use this class we'll add Facebook messenger checkbox after "Add to cart" (element with class omnisend-add-to-cart-button) button.


7. Pass cart and order data via API

Use backend API to pass user cart, order and order status changes:

You can also read Abandoned Carts guide - if you've completed steps 1 and 2 in this guide, we'll have all needed data.

Note: be sure to pass as much data as you'll have, even optional fields. For example, we'll need to get full billing address (address, city, postalCode, state, country) for Order confirmation Facebook messenger message.