The default setup for a multi-variate experiment asks you to place what are called “Section Tags” on your test page. For example consider a header for a fictitious pet food web site:

<script>utmx_section('Heading')</script>
World’s best pet food!
</noscript>

The purpose of these tags is to identify a contiguous span of HTML on your test page with which you would like to experiment. In the GWO online tool, you would enter the alternative variations for this section. For example:

This allows you to specify an alternative which will replace the original content on your test page. In fact, everywhere this pet food website mentions the phrase “World’s best pet food!”, you could instrument that phrase with the scripts above to have a visitor to your site experience every instance of the phrase on the site with the same alternative variation.

But, what if you want to vary multiple parts of a page (or pages) on your site in concert with each other? For example, let’s say that our fictitious pet food web site shows a letter to visitors, like so:

Then let’s say that you want to have multiple variations of the letter, each with a different tone in the salutation and signature. For example, an informal tone:

Or, a formal tone:

Now, you could implement this in the same manner as the section shown above. However, because the salutation and signature are separated by the body of the letter, you would have to include an entire copy of the body in each variation of the section, where the different variations differ only by the salutation at the beginning and the corresponding signature at the end.

Now, in this simple example the body is not that large, but the redundancy runs the risk of introducing different bodies which would foil the experiment. And, in the case where the body is not small, you would not want to replicate the body. Furthermore, it might be the case that the two parts of your site you want to vary in concert with each other are not on the same page. The standard section tagging technique breaks down entirely in this case.

The technique I am about to explain will allow you to experiment with your site in such a way as to only require you to alter the actual pieces of the page you want to change, but allow you to have those pieces change together. This is what I call Fragmented Sections. First, a look at what you would enter into the GWO online tool for a variation of our letter’s Tone section:

What I’ve done here is to place what I call Fragments of a single section variation surrounded by special %% tokens which identify the fragments with monotonically increasing numbers starting with 1 (fragments cannot have %% sequences in them, or a different token will need to be chosen). Thus, the salutation (the first fragment) of the Formal variation of the Tone section is represented by:

%%Frag 1%%Dear Sir/Madam%%

and the signature (the second fragment) is represented by:

%%Frag 2%%Sincerely%%

The value for the informal variation of the section would look like:

<p><script>write_frag('Tone', 1)</script>Hello</noscript>,
<p>
We’re so sure your pet will flip out over this food, we
offer a double your money back guarantee! If your pet
is not satisfied in 30 days of purchase, just return the
unused portion of the food and a notorized letter from
your pet explaining why the food was less than perfect.
<p>
<script>write_frag(‘Tone’, 2)</script>Thanks</noscript>,<br>
The Pet Food Company

I’ve highlighted the two section fragments. They are very similar to the standard tags one would use, but instead of calling the utmx_section function, they call a function called write_frag. Also notice that the default version of the section fragments are encoded in the page, surrounded by the function call and a </noscript> tag – just like standard section tagging.

Now, the definition of the write_frag function:

<!-- utmx section name="Tone" -->
<script>
function write_frag(section, frag_num) {
var content = utmx('variation_content', section);
if (content) {
var token = '%%Frag ' + frag_num + '%%';
var start = content.indexOf(token) + token.length;
var finish = content.indexOf('%%', start);
document.write(content.substring(start, finish));
document.write('<no' + 'script>');
}
}
</script>

The first line of this block of HTML is a special comment which declares the presence of the Tone section to GWO. GWO normally detects the section of a multi-variate experiment by looking for the standard section tags. But, because those are not present, this comment is an alternative way of declaring the section.

First, the write_frag function uses functionality that is defined only after the Control Script has executed on the page. The write_frag function takes two arguments: a section name and a fragment number. What the function does is acquire the value of the the section’s variation as it was entered into GWO:

This call’s the utmx function which is detailed in another article. This call returns one of the %%’ed variations defined for the specified section which was chosen by GWO for this visitor to see. If an alternative variation is not returned, then the function does nothing else, and the default content is displayed. However, if an alternative variation is returned, then the function searches that variation for a block of text surrounded by the special %% tokens. The start token takes the form %%Frag #%% where # is replaced with the number of the fragment. In this example, there are two fragments, but you could have as many as you want.

Then, after isolating the value of the fragment, it document.write‘s this along with a </noscript> tag. This is exactly what the utmx_section does for you in the standard version of section tags. This causes the browser’s parser to encounter and display the fragment’s value while removing the original’s value.

Thus, with this technique, you can define sections which need not be contiguous. Please note that although this example shows how you can have a fragmented section influence a single page, the technique works just as well across multiple pages. Be sure to include the Control Script at the top of each page which contains a section or a fragment of a section.

I have a web page illustrating this very technique.