Documentation

Installation Instructions

Please read all the instructions carefully

Warning: This service is written assuming a fairly decent knowledge of HTML, particularly the DOM-view of an HTML document. If someone else built your website for you it will probably help if you solicit their advice on implementation.

There are three main steps to getting started with with hoo doo:

Preparing your site
Preparing your test
Installing the hoo doo JavaScript

Preparing Your Site

Currently hoo doo allows you to control three types of on-page factors:

Content. You can replace the HTML content of a named element with an id attribute. The system is designed to lend itself heavily to modern-day xHTML / CSS sites.
You can additionally alter the class of your named elements.
You can also attach a self-hosted stylesheet to the page. There are technical issues relating to dynamically placing <style> elements on a page.

In order to change the content or class of an element it must have an ID. Certain elements you cannot change the content of (in Internet Explorer), in particular <style> elements.

On elements you wish to replace the content of, you are advised to set the class of the element to mvt, eg: <div id="foo" class="mvt"> or <div id="foo" class="myclass mvt">. This is so that the content of the elements do not experiece "flicker".

Because of this you can specify a stylesheet as an option which will let you reference a stylesheet hosted on your server. The stylesheet will be placed at the end of the HTML head and as such will follow all usual cascading rules.

It is strongly recommended that you use a non-public test page when preparing your test

Preparing Your Test

In the test editor you will see that tests consist of two elements:

Sections: A section is an element such as a <div> or <span> with an id attribute. Each section has:
Options: An option is simply one choice for how that element changes.

An option can change one or more of three things on a page:

The content of the element it is attached to.
The class of the element it is attached to.
It can also attach a stylesheet to the page.

It's important to note that a section won't be activated unless the element it refers to is present on the page. This is especially relevant to stylesheets. A stylesheet option will only work if the section it is part of is present.

This means that if you want to test a number of stylesheets you should put them all into a section that referes to an element id is present on all the pages you want those stylesheets to be used on. For example if you wanted to test them everywhere you can put an id on your <body> tag.

Installing the hoo doo JavaScript

Once you've set up your test you can begin to install the JavaScript. Your codes can be found on the test editor for each of your tests.

First, find your test code on the test editor and add this at the bottom of your <head> for each of the pages you want to include in the test.

Second, find your conversion code and add this at the bottom of your <head> on the page of your website which indicates a conversion. This could be a contact form thankyou or a order completion page of your shop.

If you want to run the test on your conversion page, say for consistency reasons, put your test code before your conversion code.

Earnings

If you run a shop or some other website where the value of your sales is known by your website's backend, you might want to factor in the amount earnt by each combination.

Only factor in your earnings if you believe the combination of variations genuinely affects how much your visitors spend.

To specify the value of a conversion, append the query-string variable ?value to the src attribute of your conversion code, for example: