# Variants

<figure><img src="/files/DbNdMAGT9bmk4Q05Qaju" alt=""><figcaption></figcaption></figure>

***

### **What's included:**

* Unlimited Variants: create as many versions of any page as you need
* AI-Powered Generation: Let AI create completely different variants from a single prompt
* Visual Editor: manually tweak any element, any section, any variant
* Personalization: serve different variants to different audiences and segments
* Geo-Targeting: detect location automatically and serve a completely different experience\*
* Generate a unique page title and meta description for each variant\*
* Campaign Variants: create dedicated versions for each campaign, each list
* A/B Testing: test variants directly inside your project
* Performance Tracking: see what wins and iterate fast

\*If your project runs via embed.js or downloaded code rather than Maker-hosted (like custom domain mapping), page title and meta description changes, and geo-targeting variables will not work. These features require Maker to control the full page.

***

### How to Set Up Variants

**Step 1: Add Variants to Your Project**

Open your project and click on the drop-down menu in the top left corner. Click the **Create Variants** button to get started. This will create an option to create variants above the preview tab you'll use to manage all your variants.

**Step 2: Create a New Variant**

Use the dropdown that appears to add a **New Variant**. You can create as many variants as you need.

<div><figure><img src="/files/nfYVOs480kDpE7qXRTti" alt=""><figcaption></figcaption></figure> <figure><img src="/files/bezUNX7SNORVqhxRLAaS" alt=""><figcaption></figcaption></figure></div>

**Step 3: Update Elements in a Variant**

Choose the variant you want to edit from the dropdown. In the prompt box, use the element select tool to pick the element you want to change in that variant. Then enter a prompt describing the change, for example: Change text to "100% Cotton Shirts"

The update affects only the selected variant. To verify it, switch back to Default in the dropdown and compare the two versions.

<figure><img src="/files/OfY0E759JD7CI0bc4t1G" alt=""><figcaption></figcaption></figure>

**Step 4: Deploy Variants with Rules**

Once your variants are ready, head to the Variants dropdown and select **View Details**. You'll find two tabs:

**Tab 1: Variants Overview**&#x20;

Review all your variants along with their variable names and values. From here, you can bulk update, add or remove variants, and edit variable values all in one place. There is an option to update variants in bulk by uploading a CSV file.

**Tab 2: Advanced**&#x20;

Set the overrides that determine when each variant should render. You can also bulk upload a CSV file with the variants and their overrides. If you click **Bulk update (upload)**, you can download a template as an Excel file with the current variants already filled in. After adding more details to the file, re-upload it to create new variants or update existing ones.

<div><figure><img src="/files/9rXNaq4q4XIyvaiVZmX2" alt=""><figcaption></figcaption></figure> <figure><img src="/files/xtGA1CtuUDWXQZzrhd3r" alt=""><figcaption></figcaption></figure> <figure><img src="/files/jvnpYwy0movEcl6Hgj11" alt=""><figcaption></figcaption></figure></div>

**Step 5: Create Experiences**

Use the **Experience** panel to control when variants are shown. Create Experience is where you set up how your variants are served to visitors. When you open it, you'll be asked to choose between two strategies:

* **A/B Experiment**: randomly splits traffic across variants to measure which performs best
* **Personalization**: routes visitors to a specific variant when they match conditions you define, like a URL query parameter equaling a certain value. Please note that certain rules cannot be used with server-side variables (Custom JS, City, Country, JS variable, etc) and require these projects to be Maker-hosted and do not work with embed.js or downloaded code.

You can update the strategy at any time, but note that switching will overwrite the existing one.

**Note:** Before you set up the experiences, connect[ Google Analytics and select a GA4 property](https://ai.maker.co/settings/connectors) in Settings → Connectors to enable experiences.

In **Personalization,** The **Original** option is the default variant and is served when no rules match. In the **Schedule**, you can optionally set a start and end time for when the experience is active. Under **Variant Rules**, define the conditions that determine which variant is served, such as matching a query parameter. You can combine conditions using **All** to require every rule to match. Variants without any conditions will not be served.

<div><figure><img src="/files/efRZYgM0564J2MDfn8E4" alt=""><figcaption></figcaption></figure> <figure><img src="/files/BkmzvgBKhaxFglGAZdrz" alt=""><figcaption></figcaption></figure></div>

<div><figure><img src="/files/i28sl5S4wT8Cs1KnUbxA" alt=""><figcaption></figcaption></figure> <figure><img src="/files/neWiXfGzAiSAmz3nqpGy" alt=""><figcaption></figcaption></figure></div>

**Step 6: Publish**

Make sure to publish the page. Rules and variants will not go live until the page is published.

***

### FAQs

<details>

<summary>What is "Default" and can I delete it?</summary>

Default is just the name for your base project. It's always there and can't be removed. If you delete all other variants, the variant dropdown will be hidden automatically since there's nothing to switch between.

</details>

<details>

<summary>What's the difference between variants and overrides?</summary>

Variants are full versions of your page. Overrides let you swap specific elements, like a headline or image, based on a condition, without building out a whole new version. You can also use both together: a variant handles the full page version, and an override applies additional changes on top of it when the same condition is met.

</details>

<details>

<summary>When should I use overrides instead of variants?</summary>

Overrides are a good fit when you want to change just one or two elements based on a URL parameter or other condition. If you need a significantly different page experience, go with a variant.

</details>

<details>

<summary>Can I change images using overrides?</summary>

Yes. Pick a new image from your artifacts, or generate a new image directly from the override panel.

</details>

<details>

<summary>How do I make a change across all variants at once?</summary>

Always switch to Default before prompting Maker with changes you want applied everywhere. Only switch into a specific variant when the change should apply to that version only. This keeps Maker from getting confused by the variant context.

</details>

<details>

<summary>Can I generate a unique page title and meta description for each variant?</summary>

Yes. Inside the variant you want to update, prompt Maker with something like "Add a page title and meta description" and it will generate relevant content based on what's on the page. You can also ask it to do this for all variants at once from the Default view. Note that this only works on Maker-hosted projects (including custom domain mapping) and is not supported for projects using embed.js or downloaded code.

</details>

<details>

<summary>How do geo-targeting and location variables work?</summary>

You can add city or country as a dynamic variable in your content by including it in your prompt, for example: "Add in `<City>` after the headline." Maker detects location automatically. Make sure to include a note in your prompt to hide "in" if no city is available, so the word doesn't appear on its own. This feature requires Maker-hosted and does not work with embed.js or downloaded code.

</details>

<details>

<summary>Are query parameter values case-sensitive?</summary>

Yes. Make sure the value in your condition matches exactly what's in the URL, including capitalization.

</details>

<details>

<summary>What's the best way to use the bulk update template?</summary>

Download the template from the Variants panel and open it in Google Sheets so the dropdown options display correctly. The template has two sheets: one for Variants and one for Overrides.&#x20;

</details>

<details>

<summary>Can I group multiple overrides under the same condition?</summary>

Yes, and it's a good idea to do so. If you're changing both a text element and an image when the same condition is met, give them the same override name. This keeps your overrides organized as a logical group rather than creating separate, disconnected ones.

</details>

<details>

<summary>Do variants and the Create Experience work if I'm using embed.js or downloaded code?</summary>

Yes, variants and the Rule Engine work regardless of how your project is deployed. The only features that require Maker-hosted are page title and meta description changes and geo-targeting variables.

</details>

<details>

<summary>What is the Advanced tab used for?</summary>

The Advanced tab is where you create overrides. Use it when you want to swap out specific elements on a page, like a headline or image, based on a condition. It does not change the entire page, just the elements you specify.

</details>

<details>

<summary>What is Create Experience used for?</summary>

Create Experience is where you set up how your variants are served to visitors. When you open it, you'll be asked to choose between two strategies:

* **A/B Experiment**: randomly splits traffic across variants to measure which performs best
* **Personalization**: routes visitors to a specific variant when they match conditions you define, like a URL query parameter equaling a certain value

You can update the strategy at any time, but note that switching will overwrite the existing one.

</details>

<details>

<summary>What is the difference between A/B Experiment and Personalization?</summary>

A/B Experiment is for testing. Traffic is split randomly across variants so you can see which one performs better. Personalization is for targeting. You define specific conditions, like a query parameter or other rules, and visitors who match those conditions are served the corresponding variant.

</details>

<details>

<summary>When should I use Personalization vs. A/B Experiment?</summary>

Use Personalization when you know which audience should see which variant. For example, visitors coming from a specific campaign URL should see a specific version of the page. Use A/B Experiment when you want to test two or more versions and let the data tell you which one wins.

</details>

<details>

<summary>Do I need both- the Advanced tab and Create Experiences, or can I just use one?</summary>

You can use either one on its own. Overrides alone work fine if you only need to change a few elements. Page rules alone work if you want to activate full variants. That said, they work well together. A page rule can activate a variant, and an override can apply additional changes on top of that same variant when the same condition is met.

</details>

<details>

<summary>When should I use Advanced instead of Create Experience?</summary>

Use Advanced when the change is element-level, swapping out text, an image, or a variable, based on a condition. Use Create Experience when the change is page-level, meaning a condition should load an entirely different version of the page.

</details>

<details>

<summary>Can I activate a variant using overrides instead of page rules?</summary>

Yes, you can handle everything through overrides without setting up any page rules. However, if you have already built out full variants, using Create Experience to activate them with page rules is generally the cleaner and more organized approach.

</details>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.maker.co/features/variants.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
