Browse by Topic

Product Panels

Product panels are a way of showcasing products on your storefront. They can be used to:

  • display your best selling products
  • share your newest products and inform customers of the latest additions
  • suggest related products for upselling and cross selling opportunities
  • provide insight to customers by showing products other customers have viewed or purchased
  • promote specific product lines or brands
 
 

"New Products" Panel

The New Products panel on your homepage displays the most recently added products in your store. It's a great way to promote new product lines and it lets your shoppers know about new additions quickly and easily.

User-added image

 

Can I control which products in the New Products panel? Only the most recently added products appear in the New Products panel. Use the Featured Products panel for greater control over which products appear on the homepage.

Number of New Products to Display

The number of new products shown in the new products panel is controlled differently depending on which theme platform you're using (Stencil or Blueprint).

Stencil

For Stencil themes, the new products panel is controlled with the Stencil Theme Editor.

1. Go to Storefront DesignMy Themes.

2. Click Customize.

User-added image

3. The Stencil Theme Editor will open in a new window/tab. On the left, scroll down and click Home Page to expand it.

4. Scroll down to Number of New Products, then click the drop-down to select the number of new products to display on the homepage. To remove the panel completely, select Disable.

5. When you're finished, click Save Changes.

Depending on your theme, the new products panel will automatically adjust to fit whatever screen it's on. If the area is too small, the panel will break into "pages" with next/back arrows.

New products panel with next/back arrows and page indicator highlighted

Blueprint

For Blueprint themes, the new products panel is controlled in your store's Display Settings.

1. Go to Store SetupStore Settings.

2. Under Display Settings, enter the number of New Products you want to display on the homepage. To remove the panel completely, set it to 0.

User-added image

3. When you're finished making changes, click Save.

Referencing the Panel/Object in Theme Files

Stencil

See our Stencil documentation for information on how the new products panel/object is referenced in Stencil themes.

Blueprint

The new products panel is called HomeNewProducts.html. It can be found in the Panels folder of the template files. To reference the panel in a template file, insert %%Panel.HomeNewProducts%%. This panel was designed to appear on the homepage of a store; you will have to customize it for any other usage.

See our Blueprint documentation for more information on how the new products panel is referenced in Blueprint themes.

 
 

Customers Also Viewed

  • Location: Product page
  • Panel (Blueprint): %%Panel.SimilarProductsByCustomerViews%%
  • Summary: Customers who viewed this product also viewed these products.

Customers Also Viewed panel

This panel shows products that were viewed by customers who also viewed the current product. It sometimes won't populate for newer stores, because it needs products to reach a certain view count in conjunction with one another before it has enough data. Once the store has seen some traffic — around 100 views per product — it can start populating the products.

This panel can be enabled or disabled in the Display Settings under Enable 'Customers Also Viewed'? Beneath it, the Products Related by Views setting allows you to set the number of products.

Enable Customers Also Viewed?

 

Using a Stencil theme? In some Stencil themes, such as Cornerstone, this setting can be located in the Theme Editor under the Product section.

 
 

You May Also Like

  • Location: Add-to-Cart pop-up (Fastcartthickboxcontent.html)
  • Global (Blueprint): %%GLOBAL_SuggestedProductListing%%
  • Summary: Products that are similar based on name and description.

You Might Also Like

This panel shows suggested products based on the same algorithm used by Related Products; i.e. similar product names and descriptions.

 
 

Similar Products by Category

  • Location: Product page
  • Panel (Blueprint): %%Panel.ProductByCategory%%
  • Summary:  Links to categories this product belongs to.

Similar products

The similar products panel displays the categories that your product belongs to. This panel shows you only the category name and a link to the category, not individual products or pictures of the product.

Was this article helpful?