Project, Experience (Experiment or Personalization), Variation Javascript

Overview

Convert enables you to include JavaScript snippets as part of your Project, Experiment or even Variation.

Global Project JavaScript

Convert allows you to include a JS snippet in your Project. This means that all the pages that have the Convert tracking code installed will have the snippet included. 

The snippet would be included just like any other library that you include in your web page. 

The code does not trigger automatically. You will need an event to trigger it. A common event is:


convert.$( document ).ready(function() {
// Your code here
});

You can edit the snippet by going to your Project Settings. Click on the Settings sidebar menu item and scroll to the bottom.

mceclip2.png

Global Experience JavaScript

Convert Experiences allows you to insert a JavaScript snippet into a page when an experience is triggered. The snippet would be included just like any other library that you include in your web page. This only applies to experience types that include the Visual Editor (ie, you cannot do this with a Split URL Experiment).

To add JavaScript to your experience. 

  1. Open the Visual Editor from the Experience Summary
  2. Click on the settings button (gear icon).
  3. Select Global Experience JavaScript.
  4. Add the JavaScript snippet.
  5. Save your Experience.


mceclip0.png

The way the code is added to the page you are testing or personalizing would be equivalent to adding it to the head section inside a script tag. 

Additionally, you could add JS events such as click or hover events for your code to trigger.

Variation JavaScript

Convert Experiences enables you to add a JavaScript snippet in the variation of your choice. This can only be done in experience types where the Visual Editor is available (ie, this is not possible in Split URL Experiences).

With this feature, you can test if certain functionality added by the snippet improves your conversion.

For example, you could A/B test customer support chat by adding the chat code to the Variation.

To add it:

  1. Open the Visual Editor from the Experience Summary
  2. Hover over the Variation name and a pencil will appear.
  3. Hover over the pencil and the Variation menu appears.
  4. Select Custom JavaScript
  5. Add your code in the editor.

mceclip1.png

The code added here will not run automatically. You would need an event to run it just as you would with any included JS library. 

Calling Functions Declared There

To call a function declared in the Global Project JavaScript or the Global Experience JavaScript sections, just declare it in the following way:

See the Pen Global JS Function Declaration by Convert.com (@gcrewe) on CodePen.

keywords: experience js

Have more questions? Submit a request

Comments

  • Avatar
    Robert Kingston

    What is the difference between custom JS and code editor?

    Does custom JS only run once? And code editor run the snippet every 50ms for <2 seconds?

  • Avatar
    Alex Kolenoff

    Custom JS only runs once, yes. Code editor runs the code in there every 50 ms until document ready is hit, and then once more.