Kameleoon

If you prefer to use the web plugin (the “light” version of the Chrome extension that works in other popular browsers), you will find the necessary information at the end of this article.

Installation of the extension

First, add the extension to Chrome. It can be downloaded here on the Chrome Web Store.

Open the web console (F12 on PC or command+option+I on Mac).

Click on the Kameleoon tab from the web console, then on the Activate button

Then let yourself be guided by the extension to activate it! Your login page to your Kameleoon App opens automatically. Enter your login details.

Simplified authentication

You can also use the Kameleoon icon of the extension to start the authentication process.

Click on the Kameleoon icon and a pop-up will appear.

Click on the Open Login Pop-up button to display the Login pop-up. You can use the login pop-up to enter your email and password to login.

Cookie authentication

You can log in using your current session.

If you are currently logged in the Kameleoon app, it means that you have a current open session that you can use to log in the Chrome extension.

Click on the Kameleoon icon and a pop-up will appear.

If you have a current session on your browser, a section will be displayed under the Open Login Pop-up button, to allow you to log in using your current session.

Click on the Log in as… button and that’s it!

Note: Logging out follows the same steps as logging in. Just click on the Kameleoon icon and click on the Log out button.

Authorizations

The My websites page opens.

That will activate the extension and give you the authorisations to use the extension on all websites configured in your Kameleoon account.

The first time you activate the extension, you will then be redirected to your website so that you can use the extension straight away.

Note: If you add a new website to your Kameleoon account, you will see the following message:

Simply click on the Proceed to tag injection button. This shortcut will take you directly to the Tag Injector. Then, update your authorizations. A message will confirm the update.

Note: If you add a new website to your Kameleoon account, you can also update your authorizations by clicking on the link Update list of sitecodes at the bottom of the extension dashboard.

Structure

Several tabs are available in the extension :

Campaigns
Assets
Timeline
Dev tools
Options

You also get access to a dashboard page by clicking on the Kameleoon logo, from which you can add custom widgets.

Dashboard

The section that appears by default when the extension is opened is a dashboard.

With one click on the + icon you can build and customize this dashboard to have in front of you the information that is essential to you.

Each widget can be enlarged, reduced, closed…

You can increase the number of lines by clicking on the three-point menu at the top left.

The inserts at your disposal are as follows:

Consent: indicates whether consent has been given for Experiments/Personalisations (“true” may mean either that you have given your consent or that your consent is not required; “false” means either that you have refused your consent or that pending your consent the experiments have been blocked);
Custom data: lists the active custom data on the page, their ID and value;
Experiments: lists all experiments running on the page and indicates their ID, evaluates targeting (true/false), also indicates the ID of the registered variation and displayed variation;
Personalizations: same for all personalizations running on the page;
Site Code: you can find it at a glance!
Visitor Code: indicates the visitor code that has been assigned to you, which allows you to monitor (among other things) the accounting of visits.

You will find at the bottom of this dashboard a link to update the sitecodes when a new website is added to your Kameleoon account.

Campaigns

Experiments

You will find in this tab all your experiments running on the page.

You can add or remove columns by clicking on Add columns to customize the table.

Id: ID of the experiment. On click you can display the details.
Name: Name of the experiment.
Triggered: True if the experiment was triggered on the page, else false.
Triggered In Visit: True if the experiment was triggered in the current visit, else false. This means that your visit fulfilled the experiment’s segment conditions at some point.
Active: True if the experiment is currently active on the page, else false.
Activated In Visit: True if the experiment was activated in the current visit, else false. Note that a triggered experiment does not necessarily imply that the experiment was activated, since several additional factors can affect this activation (for instance, the visitor may be part of the traffic excluded from this experiment, or capping options may have been set).
Displayed Variation: ID of the variation displayed to you (“No variation” when not targeted; “0” when targeted but assigned to the reference).
Associated Variation: ID of the variation on which you have been assigned with the visitor code (“0” when not targeted). You can force a variation by selecting it in the dropdown. The eye icon on the right allows you to preview it.
Date Modified: Date of the last change made to the experiment.
Assignment Time: When you were assigned to the variation. If this is the original and you have not been targeted, the value is “Not assigned yet”.
Online since: The date the experiment was put online.

Variations

When you click on the ID of an experiment, a menu opens. The first tab gathers all the variations of the experiment, indicating their name, ID and JS/CSS (if code has been injected on the variation).

You can switch from one variation to another by clicking on the variation ID.

The Elements section lists all the elements that are supposed to be changed for a variation. It allows you to debug your campaigns and quickly see if the elements are detected in the page. Each element is represented by its selector. When the element is displayed in red, it means that the element is not detected in the page; in green, the element is detected in the page.

Each item has two buttons: a copy button and a highlight button.

The copy button can be used to copy the CSS selector.

The highlight button can be used to highlight the associated element in the page. Therefore, it is not available when the element is not detected in the page.

You can also highlight all the elements in the page, using the icon that appears above the list of elements.

Configuration

The entire configuration of the experiment is displayed in the extension.

You will then directly find the information that is normally in the console.

Targeting

In this section, the targeting conditions are shown in a much more intelligible way than in the console, with logical links between the conditions.

Some conditions give access to additional details when you click on them. For example, for a JS condition, the JS to be executed will be displayed.