Wix Stores: Adding and Setting Up Product Galleries

10 min read
Product Galleries are the way to showcase the products you offer. You can add a gallery to any site page and then decide what to display: All your products or one specific category.
Depending on your preferences, you can choose between a Grid gallery or a Slider gallery, like the one below:
In this article, learn more about:

A Grid Product Gallery is a great way to display a large number of products. Products appear in a grid with multiple columns and rows. 
You can add a new shop page that comes with a Grid Gallery built in. Alternatively, you can add a Grid Gallery to any site page.

To add a Grid Gallery and select a category to display:

  1. Go to the page to which you want to add a gallery.
  2. Open the Add Elements panel in your Editor:
    • Wix Editor: Click Add Elements  on the left side of the Editor.
    • Editor X: Click Add Elements  at the top of Editor X.
  3. Click Store.
  4. Click Grid Product Gallery.
  5. Drag the Grid Gallery to the relevant location on your site page.
  6. Click the gallery in the Editor.
  7. Click Choose Category.
  8. Select an option:
    • To display all products: Make sure the All Products category is selected.
    • To display one category: Click to select a category.

The gallery is the first part of your store that customers see. Customize it to make sure it makes a great impression. 

To customize a Grid Gallery:

  1. Go to the page in the Editor containing the gallery you want to customize.
  2. Click the Product Gallery.
  3. Click the Settings icon .
  4. Choose what you want to do:

Make sure the gallery looks great when customers view it on a mobile device. You can adjust the design to match smaller screens and allow customers to quickly add products to the cart without  navigating away from the gallery.
Tip:
Changes you make for mobile do not affect the desktop view.

To customize the Grid Gallery for mobile:

  1. Go to the page with the Grid Gallery you want to customize.
  2. Click the Switch to Mobile icon  at the top of the Editor.
  1. Click the Grid Gallery.
  2. Click Settings.
  3. Do any of the following to customize your gallery for mobile:
    • Show Add to Cart button: Enable to allow customers to add products to the cart without going to the Product Page. If enabled, click the Show quantity toggle to allow customers to add more than one of the product to the cart. 
    • Show product options: Enable to display product options such as sizes or colors.
    • Customize the layout: Display products in 1 or 2 columns.
    • Customize the design: Drag the toggles to adjust the text size for mobile.

A Slider Gallery is the perfect way to show off your products. Customers can click the navigation arrows to view more products. 
Notes:
  • You can display up to 32 products in a Slider Gallery.
  • You can customize the slider gallery to turn it into a Related Products gallery

To add a Slider Gallery and select a category to display:

  1. Go to the page to which you want to add a gallery.
  2. Open the Add Elements panel in your Editor:
    • Wix Editor: Click Add Elements  on the left side of the Editor.
    • Editor X: Click Add Elements  at the top of Editor X.
  3. Click Store.
  4. Click Slider Product Gallery.
  5. Drag the Slider Product Gallery to where you want to place it.
  6. Click the gallery in the Editor.
  7. Click Settings.
  8. Select an option:
    • To display all products: Make sure the All Products category is selected.
    • To display one category: Select a category from the Which category to display? drop-down.

Customize a Slider Product Gallery to get the perfect look. You can personalize the gallery's text and design, choose what elements to display (e.g. an Add to Cart button) and much more. 

To customize a Slider Gallery:

  1. Click the Slider Product Gallery.
  2. Click Settings.
  3. Choose what you want to do:
Want to learn more?
Check out the full course in Wix Learn on building your store or skip to the last video on designing and publishing your store.

Did this help?

|