A script for content substitution on a website for A/B testing

If you are a marketer or SEO specialist, you know how important it is to regularly test hypotheses: headlines, images, calls to action, forms that influence user behavior and conversion.

But running A/B tests runs into technical difficulties. You need to make changes to the code, wait for the help of programmers, coordinate the changes with IT, and as a result, you either postpone the test or run one option every six months.

The substitution script from QForm solves this problem. With it, the content changes directly in the user's browser, without edits on the server or involving developers. To do this, you just need to connect the script, create a file with options (channel.json) and post it on the site.

The content is replaced automatically, the user sees only one version assigned to him by the system, and the information immediately goes to Yandex.Metrica.

At the same time, search engines only see the original content, because the substitution occurs after the page is loaded. This means that the tool is SEO-safe.

How everything works: from the script to the substitution

The QForm script checks which test group the user is in and, based on predefined rules, inserts the necessary content into the specified elements on the page.

To make everything work correctly, you need to take three steps:

Connect the script

Add this line toor before:

html


<script defer src="https://storage.yandexcloud.net/script/channel/channel.js "></script>

 

Specify the elements on the page

There are HTML blocks on the page where you insert different versions of the content. To do this, it is enough to specify understandable CSS classes for them.

Example:

html


<div class="text-1">Default title</div>
<div class="text-2"><img src="default.jpg "></div>

The script will find all blocks with text-1 and text-2 classes and replace their contents with what you specify for the corresponding option in the settings. You come up with class names yourself - the main thing is that they match the keys in the JSON file.

Create a channel file.json

After the classes are specified, we proceed to configure the options themselves. This is done in the channel configuration file.the json that should be at the root of the site.

Example:

json


{
  "yandexCounterId": 123456789,
  "channels": {
    "variant-a": {
"text-1": "Heading for variant A",
"text-2": ""

Buttons and CTA

Play with the button texts or their design.:

json


"text-3": "<button class='btn'&Get an offer"

or

json


"text-3": "

QForm Forms

Show different versions of the forms: with video, without video, with different lengths.:

json


"text-4": "div data-formid='form_a'/div" < button id="code-11">copy

or

json


"text-4": "div data-formid='form_b'/div"

Videos and widgets

Test greetings, explanations, demonstrations:

json


"text-5": "
/div>"

or

json


"text-5": "<div data-widget='videowidget_b'></div>"

All substitutions are recorded as goals in Yandex.Metrica. You will be able to track exactly which options gave the best result: by views, clicks, form submissions, and other actions.

Now let's see how the script works in conjunction with other QForm tools, and what it does in terms of automation and analytics.

How the script works in conjunction with QForm

One of the main advantages of the script is that it perfectly complements other QForm tools. This allows you not only to replace the content on the screen, but to build a full-fledged funnel: from showing to receiving the application and transferring it to CRM.

Example of the process:

  1. The user gets to the site and is assigned option A or B.
  2. The script substitutes the necessary content: text, banner, or form.
  3. The user fills out the QForm form.
  4. The system automatically transmits its segment to the form (via cookie or utm).
  5. The application goes to the CRM and you immediately see which option it came from.
  6. Yandex.Metrica records the goal with the name of the option.

As a result, you get transparent analytics and full compatibility with all the features of QForm.

Integration allows you to:

➔ use different forms on the same page;

➔ see in the CRM which option the lead came from;

➔ start automatic actions (for example, sending KP);

➔ collect and filter data by segment;

➔ Receive test analytics without manual work.

Now that we have analyzed the mechanics and capabilities of the script, let's summarize its advantages.

Why is it convenient and effective

Tests using the QForm script are much simpler and faster than classic solutions where code work is required.

Setting up the test takes a minimum of time: one script + one file with options. Everything is readable and updated without the risk of breaking the site or affecting its performance.

You decide for yourself what to change: titles, images, forms, buttons, videos. Everything is configured via the channel file.json, which means you don't depend on developers.

The script is suitable for any websites: Tilda, WordPress, Bitrix, self-made CMS. Goals are immediately sent to yandex.Metrica, and segment information is integrated into QForm forms and reports.

This allows the marketer to work effectively: he came up with a hypothesis, launched it, saw the result, and fixed the best solution.

Security and impact on promotion

When it comes to content and its replacement, it is important to understand how this affects the SEO and stability of the site.

Site security

    The script runs on the client side, meaning nothing changes on the server or in the source code of the site.
  1. It connects asynchronously (defer) and does not block the page loading.
  2. Even if the file is a channel.json is temporarily unavailable, the site will continue to work normally without errors.

Impact on search engine optimization

  1. Search engines (Yandex, Google) see the original content with no changes. This protects against duplication and does not affect indexing.
  2. All content options are tested on one page, without new addresses or duplicates. This is important for maintaining the page's position in the search.
  3. Adding video widgets from QForm, which can be tested using the same script, increases behavioral indicators: time on the site, engagement, viewing depth. And these are real advantages for SEO.

The script has been tested on popular platforms and does not conflict with analytics, A/B testing systems, form builder or other external widgets.

Conclusion

The content substitution script from QForm is convenient and safe for A/B tests on the site. Everything is set up in a few steps: you simply connect the script, create JSON with options and specify in which blocks you need to change the content. At the same time, you do not need to change the site structure or make edits to the code.

The test results are immediately sent to Yandex.Metrica, and the options themselves can be used in applications, forms, and CRM systems. This gives the marketer