Integration Documentation
      Back to home
      1. Hovr Help Center
      2. Integration Documentation

      WooCommerce Integration

      Integration steps

      First, locate your code within your Hovr dashboard. This will appear upon first login via the screen below, or can be accessed at any time by selecting the "Settings" icon within your dashboard.

      Screen Shot 2023-05-09 at 1.33.39 PM

       

      Sites using WooCommerce will need a different script compared to the script given via the admin tool. Listed below are the before and after version of the script needed to get Hovr up and running. You can copy and paste the code displayed in the "Code AFTER" section directly into your global plugin section or anywhere else you are able to add in custom snippets of code. The only thing you will need to change is the siteId value.

       

      Code Before:

      <script id="hio-script-identifier" defer src="https://plugin.hiosocial.com/bundle.js" data-id={siteId}></script>

      Code AFTER:

      (function(d, id) {
          let hovr;
          hovr = d.createElement('script');
          hovr.id = id;
          hovr.setAttribute("data-id", {siteID});
          hovr.defer = true;
          hovr.src = 'https://plugin.hiosocial.com/bundle.js';
          d.head.appendChild(hovr);
      }(document, 'hio-script-identifier'));

       

      Why do I need a different code?

      When WooCommerce serves up the content, it will occasionally overwrite the src value in our script which is needed to run our code. When that value gets overwritten it is impossible to download the necessary code Hovr needs to run.