Skip to content

Search is only available in production builds. Try building and previewing the site to test it out locally.

Getting started

Lesson 2 — Create a product campaign

In this lesson, you will build two targeted banners: one for the home page and one for the cart page.

Create a home page campaign

In this section, you will create a targeted block for the home page that displays a banner with iPhone 13 promos when a Plan-Connect customer logs in.

  1. Open the index document (Home Page) in your project root.
  2. Locate the Hero block.

Open the Home page

Open the Home page

Target Plan-Connect subscribers

  1. Insert a new —Section Break— directly after the Hero block’s section-metadata using the Section Break tool in the Edit menu.
  2. Insert a targeted-block fragment from Library > Blocks > Targeted Blocks.
  3. Change the targeted-block values as follows:
    • Type: home-top
    • Customer Segments: planconnect-subscribers
    • Fragment: /fragments/promos/iphone13-promo

Target Plan-Connect subscribers

Target Plan-Connect subscribers

Target all customers (general audience)

  1. Insert another targeted-block fragment direct after the previous fragment (within the same section).
  2. Change the targeted-block values as follows:
    • Type: home-top
    • Customer Segments: Remove the row (delete row)
    • Fragment: /fragments/promos/iphone13-teaser

Target all customers

Target all customers

Preview the general customer banner

  1. Click the Action button (paper plane icon), select Preview.
  2. Confirm that the iphone13-teaser banner is displayed.

Preview the general customer banner

Preview the general customer banner

Preview the Plan-Connect subscribers banner

  1. From the home page preview, select Account > Login from the site’s navigation menu and enter these credentials:
    • User: L320+seat-xx@adobeeventlab.com (replace xx with your 2-digit seat number)
    • Password: Adobe4Summit!
  2. Confirm that the iphone13-promo banner is displayed.

Preview the Plan-Connect subscribers banner

Preview the Plan-Connect subscribers banner

Create a cart page campaign

In this section, you will create a targeted block for the cart page that displays a banner with Apple watches when a Plan-Connect customer adds an iPhone 13 to their cart.

  1. Open the cart document in your project root.
  2. Insert a new —Section Break— directly after the commerce-cart metadata block using the Section Break tool in the Edit menu.
  3. Insert a targeted-block fragment from Library > Blocks > Targeted Blocks.
  4. Change the targeted-block values as follows:
    • Type: under-cart
    • Customer Segments: planconnect-subscribers+product-in-cart
    • Fragment: /fragments/promos/recommended-watches

Open the cart document

Open the cart document

Preview the cart banner

  1. Click the Action button (paper plane icon), select Preview.
  2. Login to the site as a Plan-Connect customer (Account > Login) and enter the following credentials:
    • User: L320+seat-xx@adobeeventlab.com (replace xx with your 2-digit seat number)
    • Password: Adobe4Summit!
  3. Add iPhone 13 to the cart.
  4. Confirm that a promo block with Apple watches is shown.

Preview the cart banner

Preview the cart banner