Interactive Live Data Preview in Ecommerce Store Builder

Live Preview in Ecommerce Store Builder lets you test your Store with real product data before publishing. You can browse products, select variants, use Add to Cart, update quantities, and move through supported Store pages directly inside the builder.

Turn Live Preview off whenever you want to return to dummy product data. This guide explains how Live Preview works, what you can test, and how preview behavior changes across Store pages.

TABLE OF CONTENTS

• What Is Live Preview in Ecommerce Store Builder?
• Key Benefits of Live Preview
• Prerequisites and Limitations
• How to Use Live Preview
• Preview Products and Store Interactions
• Interact with Sections in the Builder
• Frequently Asked Questions
• Related Articles

What Is Live Preview in Ecommerce Store Builder?

Live Preview lets you use real product data while designing and reviewing your Ecommerce Store inside the Store Builder.

When enabled, supported Store pages and product elements display real products instead of dummy preview data.

 You can then test supported product, navigation, and cart interactions without leaving the builder.

Turn Live Preview off whenever you want to return to dummy product data.

Key Benefits of Live Preview

Live Preview gives you a more realistic way to review the Store experience before publishing.

• Real product data: Preview your Store with products from your account.
  
  
• Interactive product testing: Navigate products, select variants, and test supported Add to Cart actions.
  
  
• Cart testing: Add products, update quantities, and remove items.
  
  
• Cross-page preview: Carry preview-cart products through Cart, Checkout, and Thank You.
  
  
• Flexible previewing: Switch between real and dummy product data while designing.

Prerequisites and Limitations

Live Preview behavior depends on whether products are available in the account and which Store page you are editing.

• If the account has products, Live Preview is ON by default.
  
  
• If the account has no products, Live Preview is OFF by default and dummy products appear.
  
  
• Custom Product Details Pages do not include the Live Preview toggle and continue using dummy preview data.
  
  
• Checkout inside Live Preview is a preview experience only.
  
  
• Real-time shipping rates, taxes, multiple payment methods, and functional checkout fields are not supported in the current Checkout preview.
  
  

Note: Checkout limitations described in this article apply only to the Store Builder Live Preview experience. They do not describe the behavior of the published Ecommerce Store checkout.

How to Use Live Preview

Use the Live Preview toggle to switch between real and dummy product data while reviewing your Store.

1. From the Sub-Account View, go to Sites.
   
   
2. Select Stores.
   
   
3. Open the Ecommerce Store you want to edit.
   
   
4. Open the Store page you want to review.
   
   
5. Locate the Live Preview toggle in the Store Builder.
   
   
6. Turn Live Preview ON to use available real product data.
   
   
7. Test supported products, variants, navigation, and cart actions.
   
   
8. Turn Live Preview OFF to return to dummy product data.

Preview Products and Store Interactions

Live Preview lets you test supported interactions across the Store flow instead of reviewing each page with static product data.

Product List Page and Product Details Page

Use the Product List Page and Product Details Page to review how real products behave inside the builder.

With Live Preview enabled, you can:

• Navigate from the Product List Page (PLP) to a product.
  
  
• Review real product data on the Product Details Page (PDP).
  
  
• Select available product variants.
  
  
• Use supported Add to Cart actions.
  
  
• Navigate through supported Store pages.
  
  

If you open the default PDP directly in the builder, Chat To Clients CRM displays one random real product from the account.

Note: Custom Product Details Pages continue using dummy preview behavior and do not include the Live Preview toggle.

Product Widgets

Product widgets continue using their configured actions while you preview the Store.

Supported widgets include:

• Featured Product
  
  
• Featured Products
  
  
• Upsell
  
  

Whether a widget displays dummy or real product data depends on the Live Preview state and its configured product assignment.

Cart, Checkout, and Thank You

The preview cart carries supported product data through the Store flow so you can review multiple pages with realistic content.

With Live Preview enabled, you can:

• Add products to the cart.
  
  
• Update quantities.
  
  
• Remove items.
  
  
• Review products on the Cart page.
  
  
• Carry preview-cart contents into Checkout and Thank You.
  
  

If the preview cart is empty, Checkout and Thank You still display one or two products from the account so you can review the page design.

Checkout remains preview-only inside the builder. Real-time shipping rates, taxes, multiple payment methods, and functional checkout fields are not included in the current Live Preview experience.

Interact with Sections in the Builder

The Store Builder separates selecting a section for editing from interacting with actionable elements inside that section.

The first click on a section selects it for editing.

After the section is selected, supported actionable elements can perform their expected preview behavior, including:

• Product navigation
  
  
• Redirection
  
  
• Add to Cart
  
  

This lets you edit the Store while also testing supported customer interactions directly inside the builder.

Frequently Asked Questions

Q: What happens when I enable Live Preview?

Supported Store pages and product elements use available real product data instead of dummy preview data.

Q: Is Live Preview enabled automatically?

Yes, when the account has products. If no products exist, Live Preview is off by default and dummy products appear.

Q: Can I switch back to dummy product data?

Yes. Turn Live Preview off at any time.

Q: Does Live Preview work with Custom Product Details Pages?

No. Custom PDPs continue using dummy preview behavior and do not include the Live Preview toggle.

Q: What happens when I open the default Product Details Page directly?

With Live Preview enabled, the builder displays one random real product from the account.

Q: What happens when the preview cart is empty?

Checkout and Thank You can still display one or two products from the account so you can review their page designs.

Q: Can I complete a real checkout inside Live Preview?

No. Checkout inside Live Preview is for reviewing the Store experience. Functional checkout fields, real-time shipping rates, taxes, and multiple payment methods are not supported in the current Live Preview experience.

Related Articles

• How to Set Up an E-Commerce Online Store (Websites)
• Custom Product Details Page for E-commerce Stores
• Ecommerce Store - Customizing Checkout Pages
• Share & Preview Product Pages Directly from Stores