Using the graphic editor

If you use Kameleoon to do A/B test, you probably already know how to use the graphic editor. This tool allows you to make some changes directly on your webpages with a few simple clics, and to launch A/B tests with the variations you have created. You can also use these variations for your web personalizations.

Here are the basics informations you need to know about our graphic editor. For further information about the editor and how to use it, please read the A/B testing documentation.

Launching the editor

From your website

To launch Kameleoon on your website, go to one of your pages on which Kameleoon is installed and press the Maj + F2 keys, or Fn + Maj + F2 for mac users.

You can also use an alternative method to launch Kameleoon. Simply add the following code at the end of your webpage URL:

#kameleoon=true

For instance, the URL http://mozilla.org will become:

http://mozilla.org/#kameleoon=true

When the editor has loaded, a login pop-in appears. Type in your username and password to access the edition mode. When the editor is open, Kameleoon header will appear above your webpage.

From your personal space

You can also launch the editor from your personal space

To do so, go to your A/B testing dashboard and click on the “+” icon on the header.

Using the editor

You can find all the information about the graphic editor on the A/B testing part of the documentation.

Adding and editing variations

You can manage all of your variations on the header. These are the variations you can use for your web personalizations.

The « Original » is the original version of your page: it cannot be changed nor deleted. Your changes have to be made on a variation.

To add a new variation to your test, click on the following button:

Then, you can click on the variation to display the action menu.

Click on “Rename” or double-clic on the variation name to rename it. Make sure you name your variation properly because this is the name you will find while creating your personalization.

You can now add or delete as many variations as you want to, but the test must have at least one variation.

Changing an element

Once you have selected a variation, place your cursor above an element to select it. A selection frame will appear to help you to select the element of your choice. When you are above the element you want to select, simply click on it with your mouse.

When the element is selected, a left panel appear. The tools available are not the same according to the element selected. To display more tools, click on “More options”.

Three tabs are available:

  • Style: allows you to change the color, the text, add or edit a link, add a shadow or an outline or hide an element.
  • Position: allows you to change the position of an element on the page, to change its dimensions or to add or change margins.
  • Tracking: allows you to add or to create a click tracking.

For further information about the functionalities available, you can read our article Using Kameleoon editor.

Have more questions? Submit a request
Powered by Zendesk