Showing a Browser-assigned Variant from Your Own Code
Learn how your page code shows the variant the Pertento snippet picked in a Server-side experiment with Assignment: Browser.
2 min read
With Assignment: Browser, a Server-side experiment is assigned like a Multi Variant one. The Pertento snippet picks a variant for each visitor by weight, keeps it for that visitor and counts them. The difference is that the variant is not built in the visual editor: your own page code shows it.
Nothing beyond the snippet is needed. There is no server key and no SDK, and URL, device, cookie and activation targeting apply as usual.
From the variant's own JavaScript
This is the simplest way. Each variant runs its own JavaScript when it applies, so call your code from there. Open the variant with Open Editor and add a call such as:
showVersion('one-page');The snippet runs it at the moment the variant applies, so there is no timing to manage. See HTML, CSS and JavaScript in a variant.
Reading the assignment later
On a click, a route change in a single-page app or anything else after the page has loaded, read the assignment from window.Pertento.expvar, keyed by experiment ID:
const variantId = window.Pertento?.expvar?.['4846'];
switch (variantId) {
case '11365':
// show the variant
break;
default:
// not in the experiment: show what you show today
}The settings tab, under Assignment, shows this code with your experiment's own IDs.
Things to know
- The assignment is only certain once the snippet has run, and there is no event to wait for. Do not read
expvarduring the first render; use the variant's JavaScript for that. - A visitor who is not in the experiment has no entry, so always handle the default case.
- If the first render has to be right, use Assignment: Server instead. See Running a Server-side experiment with Pertento.