# How to Set Up a Checkout Personalization or Test

Checkout Personalizations let you add product upsells or content directly to your Shopify checkout — either for all visitors or a targeted audience. If you want to test variations against each other, create a Checkout Test instead. The setup process is the same.

## Step 1: Create a block

1. Go to **Checkout** in your Intelligems dashboard.
2. Select the block type you want to create: **Upsell**, **Trust badges**, **Call out**, **Static image**, or, **Brand logo**.
3. Depending on which block type you've chosen, you may need to choose a layout. 

## Step 2: Configure your block

Configuration options vary by block type. See below for Upsell Blocks and Content Blocks.

## Upsell Blocks

#### General Settings

**Block Name** An internal label for your reference — not visible to customers.

**Location ID** A unique identifier that connects this block to your Shopify checkout. Each block needs its own ID, unless you want different blocks to show in the same location without adding each ID to Shopify.

* Use lowercase letters, numbers, and hyphens only.
* Examples: `trust-badge-1`, `warranty-callout`, `3-product-upsell`
* You'll need this exact ID when adding the block to Shopify.

#### Product recommendations

**Settings** Set whether to exclude out of stock items, whether to exclude products that are in the cart, and the max number of products returned.

**Rules** Each rule has two parts: a condition (IF) and a result (THEN SHOW). Use the + Add Rule button to add multiple rules. Rules are evaluated in order. Once a rule is met, it will stop moving forward and apply that rule.

**IF — targeting type options:**

<table><thead><tr><th width="211.72265625">Option</th><th>Description</th></tr></thead><tbody><tr><td>Anything in cart</td><td>Rule applies to any cart</td></tr><tr><td>Specific products</td><td>Cart contains or does not contain a specific product</td></tr><tr><td>Products from collection</td><td>Cart contains or does not contain a product from a collection</td></tr><tr><td>Product with tag</td><td>Cart contains or does not contain a product with a specific tag</td></tr><tr><td>Cart subtotal</td><td>Cart meets a subtotal condition</td></tr><tr><td>Cart item count</td><td>Cart contains a set number of items</td></tr></tbody></table>

{% hint style="warning" %}
Adding multiple products, collections, or tags to one condition means any single match will trigger the rule. To require more than one condition to be true, use + AND condition. For example, in the below, we would return products that were in either the "Home page" OR "All" collection.

![](https://2052204893-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2SvefuMLsJyJPAcVXeWc%2Fuploads%2Fq9iteQS1dzemOhvZPo58%2FScreenshot%202026-03-24%20at%204.07.07%E2%80%AFPM.png?alt=media\&token=e6b01e84-94df-43e1-a848-d385998dd208)

If we wanted to return products that were in both the "Home page" AND "All" collections, we would want to set it up as an + AND condition like the below:

<img src="https://2052204893-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2SvefuMLsJyJPAcVXeWc%2Fuploads%2FDIuUEim4wyWZCq9dxOdY%2FScreenshot%202026-03-24%20at%204.08.43%E2%80%AFPM.png?alt=media&#x26;token=fc5a78a3-f016-40a9-bd67-796413f88d9d" alt="" data-size="original">
{% endhint %}

**THEN SHOW — targeting type options:**

<table><thead><tr><th width="222.5078125">Option</th><th>Notes</th></tr></thead><tbody><tr><td>Shopify recommendations</td><td>Uses Shopify's recommendation engine (recommended)</td></tr><tr><td>Specific products</td><td>Show a fixed set of products</td></tr><tr><td>Products from collection</td><td>Show products from a specific collection</td></tr><tr><td>Products with tag</td><td>Show products matching a tag</td></tr></tbody></table>

{% hint style="warning" %}
Adding multiple tags to one condition means any single match will trigger the rule. To require more than one condition to be true, use + AND condition. For example, in the below, we would return products that had either the "drinkware" OR "mug" tag.![](https://2052204893-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2SvefuMLsJyJPAcVXeWc%2Fuploads%2FsqqS9XTEoGVDJievxj10%2FScreenshot%202026-03-24%20at%204.03.25%E2%80%AFPM.png?alt=media\&token=33aa136f-f5e0-4a99-8d85-62a3b93b2028)

If we wanted to return products that had both the "drinkware" AND "mug" tag, we would want to set it up as an + AND condition like the below:

![](https://2052204893-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2SvefuMLsJyJPAcVXeWc%2Fuploads%2Fu3AAznJYuK0wNlEBGqcV%2FScreenshot%202026-03-24%20at%204.05.53%E2%80%AFPM.png?alt=media\&token=a0da5b14-a265-4ade-beca-da6f4966c29d)
{% endhint %}

Use the cart tester on the right hand side of the screen to test your rules out to confirm the expected products are being returned.

**Discount** Define a percentage or fixed amount off.

#### Styling

**Heading** Appears above your upsells. Leave blank to hide it. Can edit copy, typography, color and appearance.

**Product Card** Control how each product displays — including image size and cropping, button text, typography for the product name and price, text spacing, and colors for text, background, and buttons.

**Body** Set the spacing between product cards and between the heading and the cards.

**Block** Style the container that holds the content of your block.

* **Background Color:** Sets the background color for the entire block.
* **Border Style:** The line style for the block border.
* **Border Thickness:** Width of the border around the entire block.
* **Corner Radius:** How rounded the block corners are
* **Outer Padding:** Controls spacing between the block border and the content inside.

{% hint style="warning" %}
All colors and typography come from your Shopify checkout brand settings. They are not custom color pickers - you're selecting from preset colors defined in your checkout theme. You can't fully customize checkout block colors or typography because the checkout is a secure, locked environment for security and consistency, limiting changes to basic theme settings like accent colors. This is a Shopify limitation.&#x20;
{% endhint %}

## Content Blocks (Trust badge, Call out, Static image, Brand logo)

#### General Settings

**Block Name** An internal label for your reference — not visible to customers.

**Location ID** A unique identifier that connects this block to your Shopify checkout. Each block needs its own ID, unless you want different blocks to show in the same location without adding each ID to Shopify.

* Use lowercase letters, numbers, and hyphens only.
* Examples: `trust-badge-1`, `warranty-callout`, `3-product-upsell`
* You'll need this exact ID when adding the block to Shopify.

#### Content & Styling

**Heading** Appears above your other content. Leave blank to hide it. Can edit copy, typography, color and appearance.

**Badges** Configure the layout, typography, colors, appearance, and content for your badges — including image position, font size and style for the title and subtitle, text alignment, and border and spacing settings. Use the "+ Add badge" button at the bottom of the badges section to add more badges. Each badge is configured independently with its own icon or image, colors, title, and subtitle.

**Body** Set the grid layout (rows and columns) for how badges are arranged, the alignment of the badge group on the page, and spacing between badges and between the heading and badges.

**Block** Style the container that holds the content of your block.

* **Background Color:** Sets the background color for the entire block.
* **Border Style:** The line style for the block border.
* **Border Thickness:** Width of the border around the entire block.
* **Corner Radius:** How rounded the block corners are
* **Outer Padding:** Controls spacing between the block border and the content inside.

{% hint style="warning" %}
All colors and typography come from your Shopify checkout brand settings. They are not custom color pickers - you're selecting from preset colors defined in your checkout theme. You can't fully customize checkout block colors or typography because the checkout is a secure, locked environment for security and consistency, limiting changes to basic theme settings like accent colors. This is a Shopify limitation.&#x20;
{% endhint %}

## Step 3: Preview your block

As you make changes, the preview pane on the right updates in real-time to show how your block will appear on checkout:

* Review the overall layout and spacing
* Check that colors match your brand
* Verify text is readable and properly sized
* Ensure icons are positioned correctly

{% hint style="info" %}
The preview shows your block in the Intelligems interface. The final appearance on your Shopify checkout may have slight variations based on your checkout theme settings.
{% endhint %}

## Step 4: Save and choose your setup type

Click **Next** when you're satisfied with your design. Choose one:

* **Complete checkout setup** — show this block as a Personalization to all visitors or a targeted audience
* **Create a checkout test** — run multiple variations against each other

## Step 5: Add the block to Shopify checkout

This step is required. The block won't appear on your checkout until it's added in Shopify.

1. Copy the Location ID from Intelligems (shown in the configuration instructions)
2. In Shopify Admin, go to **Settings** → **Checkout**
3. Under **Configurations**, click **Customize** to open the Checkout editor
4. In the top panel, click **Apps**
5. Navigate to **Intelligems**, click (+), and choose Checkout
6. Toggle on **Include block in Shop Pay** (recommended).
7. Paste your block **Location ID** into the block settings
8. Drag the block into the position you want in checkout
9. Click **Save** in the top right corner

{% hint style="success" icon="exclamation" %}
**Important:** Each Checkout Personalization needs to be added to your Shopify checkout separately using its unique Block ID. Without this step, the block won't appear on your checkout page.
{% endhint %}

Once this step is completed, you can preview your Checkout Personalization or Test on your live website by going to the Preview tab → selecting Open Full Screen Preview.

## Step 6: Set up targeting if needed

Targeting is an optional step. By default, a visitor will be immediately assigned to your Checkout Personalization or one of the test groups, but you can control who sees your Checkout Expierences using targeting rules. There are a few different ways you can do this:

* You can set up currency and country targeting that allows you to limit your Experience to a single currency and/or a list of specific countries.&#x20;
* You can use UTM parameters to customize your user experience under the Audience option.
* You can filter traffic based on JavaScript Expressions under the Audience option.
* You can filter traffic based on device type (i.e. mobile or desktop) under the Audience option.
* You can filter traffic based off of whether a visitor is new or returning under the Audience option.
* You can prevent users from being targeted by related experiments to reduce undesired interactions under the Mutually Exclusive Tests option.

#### **When to use targeting for Checkout:**

* Test blocks with specific customer segments first
* Show different messages to different regions
* Display country-specific guarantees or policies
* Limit to specific marketing campaigns
* Show different upsells on different devices

You can learn more about targeting [here](https://docs.intelligems.io/content-testing/targeting)!

## What happens next?

Now that you've created your Checkout Personalization or Test, you can QA using [this checklist](https://docs.intelligems.io/checkout/checkout-test-qa-checklist)!&#x20;