Optimize based on paid ad campaigns or search engine marketing
- Optimizely Web Experimentation
- Optimizely Personalization
You can use query strings in Optimizely Web Experimentation to personalize your experiments. URLs can contain a lot of information, including the query string. The query string comes after a ? (question mark) in the URL and contains data that passes from the URL to a web application. Query strings consist of query parameter names and value pairs (such as ?name=value). Multiple query parameters are separated with an & (ampersand).
Example:
A query string looks like the following in a URL (the query parameters are italicized):
www.example.com/?nameA=valueA&nameB=valueB&nameC=valueC
Where do query parameters come from?
Interaction with search and ad campaigns creates some of the most common query parameters. For example, when you integrate Google Ads campaigns with Google Analytics (GA), you can tag your users' URLs with query parameters to pass data to GA.
The following are two common forms that query strings take:
- Manual Tagging – Lets you build your own query string and takes the form ?utm_source=google&utm_medium=email&utm_name=winter_clearance. This contains less visitor information than auto-tagging (see the following), but transfers to third-party platforms like Optimizely better. See Google's article on URL builders.
- utm_source – The campaign source, like a search engine, newsletter, etc.
- utm_medium – The campaign medium, like email or PPC campaign
- utm_term – The keywords for this campaign, used in paid search
- utm_content – Differentiates ads or links that point to the same URL. This is especially useful for A/B tests for ads or links.
- utm_campaign – The specific campaign or promotion
- Auto-tagging – Appends your URL with a Google click ID that looks like ?gclid=12345. This contains all information from the manual tags (see previous) and other data passed into Google Analytics.
You can also combine the two tagging methods, which provides the best of both approaches: more data pushed to GA and more flexibility in Optimizely Web Experimentation's targeting. See also Tag your Google Ads final URLs.
Common uses for query parameters in Optimizely Web Experimentation
The most common use for query strings in Optimizely Web Experimentation is to target experiments to run only on visitors who have interacted with your ad campaign. You can set an Audience Condition on the appropriate query parameter.
Leave the Value field blank to include all values for a given parameter name. For example, if you target utm_campaign and leave the value field empty, it includes visitors who have ?utm_campaign=spring_clearance, ?utm_campaign=holiday_sale, or any other parameter value.
Using Manual Tagging or the combination method greatly increases your options for targeting experiments in Optimizely Web Experimentation.
Note
You can segment your experiment results to compare the behavior of visitors from various campaigns.
Example: Using Query Parameters for Personalization and Symmetric Messaging
This example uses query strings for personalization. This technique is known as symmetric messaging because it uses information from a visitor’s search terms to personalize the experience on your site.
This use case involves more technical implementation, but you can avoid this technical work by integrating with Google Ads.
Suppose you are using manual or combination tagging and passing search terms to a query parameter using utm_term=. With a short bit of code, you can grab that keyword from the visitor’s URL and render it on the page, ensuring a consistent experience for your traffic from the search engine to the landing page.
The following defines a function that retrieves the value of a query parameter you pass in:
function getParameterByName(name) {
name = name.replace(/[\\[]/, "\\\\\\[").replace(/[\\]]/, "\\\\\\]");
var regex = new RegExp("[\\\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results == null ? "" : decodeURIComponent(results[1].replace(/\\+/g, " "));
}In Optimizely Web Experimentation, you can place the code in the experiment's Custom Code. Enable jQuery in project settings or include it in your code.
Call the function in the <edit code> box, telling it which parameter's value it should retrieve and where it should render on the page. The function call may look like the following:
$("h1 > span").text(getParameterByName(“utm_term”));
In this case, you pass in the string utm_term to the function, which then retrieves the keyword value Split. Calling this function in your variation code changes elements with jQuery selector h1 > span on the page to Split.