Dynamic text adds another avenue to your Testing and Rollouts initiatives with VWO. It allows you to present content that is more engaging, concise and focused on improving conversions and enables visitors to get through your conversion funnel in a smooth and quick manner. All of this can be achieved with minimal to no dependency on your ability to write code.
What Dynamic Text?
Any text element on the page- be it headings, blocks of paragraphs, or the text present in CTA buttons, is usually static. Attempts to improve and test them generally remain confined to static content. The example that follows can show you how using Dynamic Text can help add another dimension to a test.
Let us say you are trying to improve the messaging around your shipping policy to understand its effect on the checkout process. If you offer free shipping for orders above $200, an appropriate message can be shown to your customer based on the current value of their cart. If the cart value is, say, $180, the message can convey that adding items worth $20 would give them free shipping, effectively making it an up-sell opportunity. By experimenting with different types of such messages, which are based on the value of the cart, you can study the effect it has on the checkout process’ conversion rate and zero in on what works the best.
Just to demonstrate how easy it is to generate Dynamic text using variables in VWO, check out another simple example where the customer’s name is fetched from a variable and simply used to greet them if they are logged in.
Why is this needed?
Website experiences are built with a lot of information about the visitor. This is usually a combination of general demographic data such as source, location, time of visit, etc., and customer-specific information such as past purchases, past content engaged with, average order value, frequency of purchases, and many other things. All these factors add up to building a ‘profile’ of a visitor whose probable expectations are delivered with matching experiences.
These factors are used extensively to test and deliver great experiences for visitors in an overarching manner. The text copy on the page, on the other hand, is usually worked on from a very static point of view. If made dynamic, the functional aspect of it can be made more engaging and direct and help test and optimize the website in interesting ways. This is achieved with the help of ‘variables,’ similar to how templates are created for mail merge. Text generated for the website using such variables is generally to
- directly show the value of a variable, e.g., greeting the user with their name once they log in. Here, the variable is the user’s Name, which is directly shown in a headline element.
- use the value of the variable as an evaluation criterion and show corresponding content, similar to the free shipping example described above. Here, the ‘cart value’ is evaluated to display a corresponding message.
You notice that using such ‘variables’ in text elements forms the crux of generating Dynamic Text. To get a detailed understanding of what variables you can use with VWO to generate dynamic text, do check out this article.
How does this work?
VWO uses Embedded Javascript (EJS) format to identify and perform Javascript operations that are ’embedded’ in HTML.
The following shows the difference between using plain HTML and one with dynamic text (variable) to show how they differ in syntax and how they function.
<h1> Hi firstName! </h1>would render as plain static headline text: Hi firstName!
But in case of
<h1> Hi <%= firstName %>! </h1>when John visits your website, the headline reads: Hi John!
As you notice, the magic lies in the <%= %>, which helps VWO identify that anything between them is to be evaluated dynamically.
You can even use advanced conditional statements like ‘If Else’ or loops like ‘Do while’ to create dynamic variations leveraging the power of data available on the page or from external sources.
