Use the wisepops() function on Shopify

Lisa Fockens Updated by Lisa Fockens

Deprecated. We've updated our Shopify app to have the wisepops() function available out of the box. If you installed our Shopify app before 2022-03-17, please go to Settings > Websites and open the setup code to reinstall our app.

If you installed our Shopify app before 2022-03-17 and cannot reinstall it, please read on.

The wisepops()  function let you give instructions to Wisepops, even before Wisepops is loaded on your website. Usually, this wisepops()  function is created when our code is executed. When Wisepops has been installed through our Shopify app, you will need to write a Javascript snippet to enable it.

Please follow these steps:

  • Go to your shop admin interface
  • Click on Online Store > Actions > Edit code

  • Go into the Snippets folder, and create a snippet named wisepops.liquid . Use the existing one if any. We encourage you to write all the code that is related to Wisepops into this file, it helps keeping things sorted.
  • Copy/paste the following snippet at the beginning of the file, and save it:
  document.addEventListener('wisepops.after-initialization', function (event) {
    window.wisepops = window.wisepops || event.detail.wisepops;
    // Write your custom code for WisePops here
  • You now need to include this snippet into your theme. Go to the Layout folder at the really top of the file list, and open the theme.liquid  file.
  • At the end of the file, before </body>, copy/paste the following line, and save:
{% include 'wisepops' %}

You will now be able to use the wisepops()  function inside the snippet file, just after the line:

// Write your custom code for WisePops here