This article will help you:
  • Use query parameter targeting in Optimizely to target visitors from certain ad campaigns
  • Understand what query parameters are and how query parameters are used in SEM
  • Create symmetric messaging experiments based on query parameter targeting

This article will describe how Optimizely can be used in tandem with Search Engine Marketing (SEM) query parameters from platforms like Google AdWords to optimize your site for inbound search traffic.

URLs can contain a lot of information, and one of the most common components is the query string. Query strings contain many pieces of information, and they can be used in Optimizely to personalize your experiments.

Optimizely's AdWords integration (available on select Enterprise plans) allows you to set up experiments based on your customer acquisition funnel. With this integration, you won't need to do the steps outlined in this article: the integration will do this work for you.

What are query strings and parameters?

The query string is the part of the URL that comes after a “?” and contains data to be passed from the URL to a web application. Query strings consist of query parameter name and value pairs (for example, ?name=value). Multiple query parameters are separated with an “&”.

 
Example:

Here's what a query string looks like in a URL (the query parameters are bolded):

www.example.com/?nameA=valueA&nameB=valueB&nameC=valueC

Here's how they would appear in your browser:

Where do query parameters come from?

Some of the most common query parameters are generated by interaction with search and ad campaigns. For example, when you integrate Google AdWords campaigns with Google Analytics, you can tag your user’s URL with query parameters to pass data to Google Analytics.

There are two common forms that query strings take:

Manual Tagging: Selecting Manual Tagging will allow you to build your own query string and will take the form “?utm_source=google&utm_medium=email&utm_name=winter_clearance”. This contains less visitor information than auto-tagging (see below), but is more easily transferred to third-party platforms like Optimizely. See this Google support article for more detail.

  • 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 - can differentiate ads or links that point to the same URL, especially useful if you’re A/B testing your ads/links to see which one is more effective
  • utm_campaign - identifies a specific campaign or promotion

Auto-tagging: If you select Auto-Tagging in AdWords, then your URL will be appended with a Google click ID that looks like “?gclid=12345”. This contains all of the information from the manual tags (see above) and other data that will be passed into Google Analytics.

There is also the option to use a combination of the two tagging methods, which if done correctly can provide the best of both approaches - more data pushed to GA and more flexibility in Optimizely’s targeting. For more information, read the Google support article on best practices to prevent data discrepancies.

What can I do with query parameters in Optimizely?

The most common use case for query strings in Optimizely is to target experiments to run only on visitors who have interacted with your ad campaign. You can do this by setting an Audience Condition on the appropriate query parameter

You can even leave the “value” field blank to include all values for a given parameter name if you like. For example, if you target the parameter name utm_campaign and leave the value field empty, it will include visitors who have ?utm_campaign=spring_clearance, ?utm_campaign=holiday_sale or any other parameter value.

When you use Manual Tagging or the combination method, your options for targeting experiments in Optimizely increase dramatically.

 
Note:

With certain plans, you have the ability to segment your experiment results. This makes it extremely easy to compare the behavior of visitors from various campaigns. For more information on which segmentations are available to you, please refer to our pricing matrix.

Example: Using Query Parameters for Personalization and Symmetric Messaging

In this use case, we’ll use query strings for personalization. This technique is known as “symmetric messaging” because it will use information from a visitor’s search terms to personalize the experience on your site.

See an example of symmetric messaging in action in this blog post by Optimizely's Steve Ebin on the impact of symmetry on Optimizely's PPC landing pages.

This use case involves a little more of a technical implementation, but you can avoid this technical work by using our Google AdWords integration (available on select Enterprise plans).

Suppose you are using manual or combination tagging and you are passing search terms to a query parameter using utm_term={keyword}. 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 search engine to landing page (and even further if you want!).

The following defines a function that will retrieve 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, " "));
}

You can place the above in the <edit code> box for a single variation or, if you want to call the function in multiple variations, you can place it in the Experiment Javascript. Below, you’ll see an example of the function both defined and called in the <edit code> box.


Then, you will need to call the function in the <edit code> box, telling it which parameter’s value it should retrieve as well as where it should render on the page. The function call may look like this:

$("h1 > span").text(getParameterByName(“utm_term”));

In this case, we are passing in the string “utm_term” to the function, which then retrieves the keyword value “Split”. Calling this function in your variation code, all elements with jQuery selector “h1 > span” on the page will be changed to “Split.”