search

codeInjecting Frontend Script

To enable Envive, there is a script to deploy on your site.

If your online store is on Shopify in a standard theme, we can insert the script for you. If you haven't already, follow these instructions to give us collaborator access and we will add the components to the theme.

If your site is not on Shopify, is headless, or you want to do the deployment yourself, you can install the Envive bundle by following these directions.

For the deployment of the script, we need the following pieces of information:

  • env to specify dev versus prod deployment

  • publicKey to identify your Envive AI installation. Please contact us to get the key.

  • show set to true if you want to turn on the UI experience (false if you want to turn it off).

To directly integrate Envive AI frontend with your frontend, inject the following script into your website, in the <head> tags.

circle-info

You need an API_KEY, please reach out to us if you don’t have one to use.

hashtag
Installation

<!-- Envive -->
<script name='spiffy-react'>
  (function() {
    window._spiffy = {
      env: 'prod',
      show: true,
      publicKey: 'API_KEY'
    };
    var loadSpiffyScript = function() {
      var script = document.createElement('script');
      script.type = 'module';
      script.src = 'https://cdn.spiffy.ai/production/universal-build/spiffy-react-components/index.js';
      script.fetchPriority = 'high';
      document.head.appendChild(script);
    };
    loadSpiffyScript();
  })();
</script>

hashtag
V3 Customers

If Merchant is a V3 installation (if you're not sure, ask your CSM), then the script.src is different and must be replaced in the above snippet with this line:

hashtag
A/B Experiment Deployment

You can use your own platform for setting up an A/B test, however please use the following custom HTML during setup.

circle-exclamation

Our primary request is to inject Envive script all on pages, even for control, so that we have visibility into the deployment and can debug any issues that come up.

hashtag
Script for Envive off (control)

hashtag
Script for Envive on

hashtag
V3 Customers

If Merchant is a V3 installation (if you're not sure, ask your CSM), then the script.src is different for both examles and must be replaced in the above snippets with this line:

hashtag
Example for Intelligems

  1. Create a test of type “Content Test” > “Onsite Edits”

  2. Create 2 test groups, Control and Spiffy On

  3. Go to “Modifications” > “Styles and Javascript”

  4. For each of the two groups, put the above script (without the initial comment and the <script> tags), and select “Immediately” as the Javascript injection timing

    • Please replace the API_KEY with the one the Spiffy team provides

    • Here’s a sample screenshot of what it should look like for the Spiffy On (with the right name for the API_KEY)

PreviousDeploying Frontend WidgetsNextIntegrations

Last updated