Activating an Experiment when someone clicks or hovers over a menu item

THIS ARTICLE WILL HELP YOU:

• Issue
• Solution

Issue

There may be times that bucketing a visitor in an experiment by landing on a page may not be sufficient. This might be because we may need to change a menu that is only seen when they hover or click on an element like a menu item. We might only want to sample the visitors that see the menu and perform this action, so the experiment is free of the noise of people that actually did not see the change.

Solution

To solve this we need to activate the experiment when they perform this action. To do this, we need to add some code in the Project Configuration that will trigger the code when the visitor hovers or clicks on an element. 

1) Add the following code to the Project > Project Configuration > Global JavaScript area. This code will trigger the experiment anywhere where the element is hovered over on any page. Here targeted by the menu_item_selector, which you should replace by your own element selector. If you want to monitor clicks replace ".hover" by ".click".

convert.$(document).ready(function() {
  // replace the next URL with the one for the page where you want to monitor the clicks or hovers
  if (location.href == 'https://www.website.com/index.html') {
    convert.$("menu_item_selector").hover(function() {
      window.runExperiment = 1;
      window._conv_q = window._conv_q || [];
      // Replace the number with the id of your experiment.
      window._conv_q.push(["executeExperiment","123456789"]);
    });
  }
});

2) Add the following JS Condition to the Locations of your experiment:

(window.runExperiment == 1)

With this code, the experiment should only bucket the right visitors and avoid adding any noise in the visitor sample.