Skip to main content

Pages

Your store comes with the Product Detail, the Product Listing, and the Cart page. You design these pages as templates in Instant Commerce and these are then used to render the product and collection pages in your store.

note

You can't add new pages in Instant Commerce.

Product Detail page​

The Product Detail page outlines how the pages for individual products in your store will look.

You configure one Product Detail page that is used for all products across your store. This means that the product pages your customers see will all have the same layout and style, which you can edit in the Editing bar.

In the center at the top of the page, you can select a product from the dropdown to see how the Product Detail page looks for different products.

note

Any changes you make in the Editing bar will apply to all products, because there is only one Product Detail page for all products.

Product videos​

Your product detail pages can display videos of your products. They will appear automatically when you link videos to your products in Shopify.

To select whether the product videos should autoplay, open your Instant Commerce store, click the Customize button and go to Pages > Product detail.

When Autoplay is on, the first product video starts playing and loops when the page is opened. If there are multiple videos on the PDP, only the first one will autoplay.

When customers click the product video, it opens in a focus mode called the lightbox. In the lightbox, customers can pause the video and see all the other controls.

Product Listing page​

The Product Listing page outlines how the collection pages in your store will look.

You configure your Product Listing page once and then that configuration is used for all collections across your storefront. This means that the collections your customers see will all have the same layout and style, which you can edit in the Editing bar.

In the center at the top of the page, you can select a collection from the dropdown to see how the Product Listing page looks for different collections.

note

Any changes you make in the Editing bar will apply to all collections, because there is only one Product Listing page for all collections.

Cart​

The Cart page outlines how your customers keep track of the products they want to purchase. Customers see the Cart page when they navigate to it with the Cart button at the top of the screen or when they add something to it.

Cart page behavior​

You can decide how the Cart page behaves when it is navigated to as well as when something is added to it.

  • When customers navigate to the Cart with the button at the top of the screen, the Cart page can appear as a sidebar on the right side of the screen or as a whole separate page.
  • Similarly, when a customer adds something to their cart, the Cart page can appear as a sidebar on the right side of the screen or as a modal overlaying the screen in the center.

Free shipping bar​

The Shipping bar on the Cart page will inform customers how much more they need to add to their cart to qualify for free shipping. You need to set up free shipping for this to work.

Payment icons​

Additionally, you can toggle payment icons on or off for both their display options:

Turn on payment icons

  • Turning on the Sidebar toggle under Payment icons means that customers will see the payment icons in the cart sidebar if you have the sidebar option selected under Nav cart button behavior. This toggle does nothing if you have the page option selected

  • Similarly, turning on the Page toggle under Payment icons means that customers will see the payment icons on the cart page if you have the page option selected under Nav cart button behavior. This toggle does nothing if you have the sidebar option selected

Product recommendations​

You can also toggle product recommendations on or off for both their display options.

Turning on the Sidebar toggle under Product recommendations means that customers will see product recommendations in the cart sidebar if you have the sidebar option selected under Add to cart button behavior.

The Sidebar toggle does nothing if you have the modal overlay option selected.