Optimize for non-Webflow sites

Build code-based audiences

Updated

Define an audience with JavaScript to target subsets of your website visitors with variations.

An audience is a subset of your website visitors (e.g., visitors in New York). You can use audiences to refine who is eligible to see variations by targeting or excluding visitors. Code-based audiences let you define your own targeting logic using custom JavaScript — great for advanced use cases that go beyond what rules-based audiences support.

You can also create rules-based audiences to target visitors using built-in criteria like traits, behavior, or integration data.

Note

If you need to use jQuery, you can request to enable jQuery as a plugin.

How to create a code-based audience

Important

JavaScript conditions must evaluate to true or false. A visitor matches if conditions evaluate to true.

Open your Optimize site in Webflow, then:

  1. Click Components in the Navigation panel
  2. Click the Audiences tab > New audience
  3. Click Code Your Audience
  4. Enter a name (e.g., Enterprise customers)
  5. Enter JavaScript code to define the audience
  6. Click Save

How to edit a code-based audience

Editing an audience on a live optimization can change who sees its variations — which might affect your results. Double-check your updates to avoid any surprises.

Open your Optimize site in Webflow, then:

  1. Click Components in the Navigation panel
  2. Click the Audiences tab
  3. Choose an audience
  4. Click Edit audience
  5. Edit your JavaScript code
  6. Click Save

Example of a code-based audience

You can use JavaScript to define the minimum screen height so that a large image in a variation is only shown to visitors who can see the full image on page load. In this example, the audience must have a screen height of 760px or more.

(function() {
  return window.innerHeight >= 760;
})();

How to use an audience in an optimization

Audiences define who can see an optimization's variations. You can set audiences at the optimization level for AI Optimize and Test optimizations, while Personalize optimizations require audiences at the variation level. Learn how to set an audience.

Related articles