Learn how to ship impactful customer journeys with Builder

Announcing Visual Copilot - Figma to production in half the time

Builder.io logo
Contact Sales
Platform
Developers
Contact Sales

Blog

Home

Resources

Blog

Forum

Github

Login

Signup

×

Visual CMS

Drag-and-drop visual editor and headless CMS for any tech stack

Theme Studio for Shopify

Build and optimize your Shopify-hosted storefront, no coding required

Resources

Blog

Get StartedLogin

You can target your content using custom types provided by e-commerce plugins after your developer has set one up. For example, you can:

  • Display an announcement bar with a coupon code when customers have a specific item in their cart.
  • Set up calls-to-action that display when viewing products from certain collections.
  • Make recommendations based on the item your customer is currently viewing.

You can start by selecting Targeting from Visual Editor's top toolbar.

A screenshot of the Visual Editor toolbar with the Targeting button highlighted.

In the Targeting window, select +TARGET to add a new target.

Select the drop-down box next to WHERE to add a new targeting condition.

Notice that in addition to the default Device and Url path, the e-commerce plugin also adds three new targeting condition types: Item in cart, Collection handle, and Product handle.

👉 Tip: The example below displays targeting condition types specific to the Shopify plugin. The types that you see may differ based on which plugin you use.

Let's select Item in cart for our example.

After selecting a condition type, you can select a resource to match your new targeting condition.

Selecting Choose product in the example below displays a searchable list of products from our connected Shopify store, where we can choose a product to target.

In this example, we select Short sleeve t-shirt from the example list below to target the product handle associated with the product.

Having set up the targeting condition, the content now appears whenever a Short sleeve t-shirt is in the user's cart.

Passing data to Builder for e-commerce targeting

for developers

After creating targeting conditions for your content, you must configure your site to pass the appropriate data to Builder.

Your targeting won't work until completing this step because Builder can't automatically infer when an e-commerce targeting condition—for instance, when a user has added a particular item to their cart—has been met.

This step involves your developer. See Setting up e-commerce targeting for more information.

Was this article helpful?

Product

Visual CMS

Theme Studio for Shopify

Sign up

Login

Featured Integrations

React

Angular

Next.js

Gatsby

Get In Touch

Chat With Us

Twitter

Linkedin

Careers

© 2020 Builder.io, Inc.

Security

Privacy Policy

Terms of Service

Newsletter

Get the latest from Builder.io

By submitting, you agree to our Privacy Policy

Product

Platform Overview

Integrations

What's New

Open Source

Builder

Builder

Mitosis

Mitosis

Qwik

Qwik

Partytown

Partytown

Popular Guides

From Design to Code Guide

Composable Commerce Guide

Headless CMS Guide

Headless Commerce Guide

Composable DXP Guide

Design to Code

Resources

Blog

Knowledge Base

Community Forum

Partners

Templates

Success Stories

Showcase

Resource Center

Frameworks

React

React

Next

Next.js

Qwik

Qwik

Gatsby

Gatsby

Angular

Angular

Vue

Vue

Svelte

Svelte

Remix logo

Remix

Nuxt

Nuxt

Hydrogen

Hydrogen

See All

© 2024 Builder.io, Inc.

Security

Privacy Policy

SaaS Terms

Security & Compliance

Cookie Preferences

Gartner Cool Vendor 2024