Adding the ShopMessage Checkbox Widget not Shopify Non-Product Pages

Follow these step by step instructions to allow your users to opt in on non-product pages:

1. You will need to tell ShopMessage where to put the checkbox plugin so that it can collect Facebook optin events from your customers. This is as simple as including the following HTML on your page where you want the checkbox plugin to load:

<div class="shopmessage-checkbox" id="addToCartCheckbox"></div> 

Note: The id  "addToCartCheckbox" can be anything you like. If you add multiple checkboxes to your page, say on an opt-in modal, then be sure to apply a different id for each one. 

Once this snippet is added, ShopMessage will add the Facebook checkbox widget into this element. As per Facebook Messenger Terms of Service, the checkbox needs to appear in a "clear and conspicuous" location such that your customers are aware they are opting in to messaging. We recommend placing this directly underneath your "Add to Cart" button as shown below:

2. You will need to tell ShopMessage the location of your "Add To Cart" button so that a Facebook "optin" event can be triggered when a customer adds something to their cart. You should call _shopmsg("confirmOptin") when a customer does an action that would warrant an "optin" event (e.g. clicking on your "Add To Cart" button).

An example of this implementation is included below, showing how to trigger an "optin" event when a customer clicks on your "Add To Cart" button. Notice that the second variable is the id  of the checkbox element added in the previous step.

$(document).ready(function() {
  $('.add-to-cart').click(function() {
    _shopmsg("confirmOptin", "addToCartCheckbox");

Want to add ShopMessage to a non-Shopify store? Check out our custom integration instructions.

Did this answer your question?