Create Interactive Product Experiences with Dynamic Variables

  1. Open your experience in Passport Builder and navigate to the landing page.
  2. Add a hotspot element over a product image.
  3. Set the hotspot position and size by dragging it over the target area.
  4. Configure the hotspot tooltip with a label and description.
  5. Set the hotspot action (show tooltip, navigate, or expand panel).
  6. Add a dynamic text element near the hotspot using a product variable.
  7. Open the variables picker and select product.title.
  8. Add a carousel element linked to product media from Brand Cloud.
  9. Configure the carousel to display images dynamically per product.
  10. Add a rich text block using product.description as a dynamic variable.
  11. Preview the experience with a specific product selected.
  12. Verify all dynamic variables resolve with real product data.
  13. Switch products in preview to confirm content updates throughout.
  14. Click Save to publish the interactive experience.
Created 2026-03-25 Last updated 2026-04-09

Was this page helpful?

Related articles