Product galleries are a great way to showcase your products and improve the shopping experience. This detailed guide walks you through adding and customizing a product gallery in Storbie.

Step 1: Access the Edit View and Select the Page

Navigate to the edit view for the page where you'd like to add the gallery.

Step 2: Add a Content Item and Choose "Product Gallery"

Add a new content item and select "Product Gallery."

Step 3: Configure Product Selection (Products)

This section controls which products are displayed:

• All products in the shop: Displays all your products.


• Products chosen individually: Allows you to pick specific products. Use the search bar to find products and add them to the "Selected products" list.
  


• Products chosen by classification and tags:
  
  
  
  • Product Tag: Enter a tag name to include products with that tag.
  
  
  • Choose a classification: Select a product classification to filter by. You can set a default classification in your shop settings.
  
  
  • Choose tag sets: Select tag sets to further refine the filter.
  
  
   


 

Click "Next" to proceed.

Step 4: Choose the Layout (Layout)

Select how you want the products displayed. Options include grid and list views. This is your default layout, but you can override it for this gallery. Click "Next."

Step 5: Set Gallery Styling (Gallery Style)

Choose whether to use your shop's default gallery styling or override it for this specific gallery. Click "Next."

Step 6: Configure Image Cropping (Image Cropping)

Choose how images are cropped to maintain consistent height:

• No crop: Images are displayed in their original aspect ratio.


• Trim image to fit: Crops the image to fit the specified dimensions.


• Shrink image to fit: Resizes the image to fit without cropping.


• Crop behaviour: If trimming, choose whether to trim or shrink the image.


 

This is your default setting, but you can override it. Click "Next."

Step 7: Customize Borders (Borders)

Control the appearance of borders around images:

• Border Style: Choose a border style (e.g., solid, dashed).


• Shape: Select the corner style (e.g., square, rounded, circular).


• Width Reduction: Reduce the image width relative to its container (e.g., full, medium, small).


 

This is your default setting, but you can override it. Click "Next."

Step 8: Enable Quick Add to Cart (Gallery Add to Cart)

Enable "Quick-Add" to replace the "View Details" button with an "Add to Cart" button for simple products. Products with options will still show a "View Options" button. Consider if this is appropriate for your products. This is your default setting, but you can override it. Click "Next."

Step 9: Define the Sort Order (Sort Order)

Choose how products are sorted in the gallery:

• Alphabetically by name


• By price (highest first or lowest first)


• Custom sort order (if available)


 

Click "Finish" to save the gallery settings.

Step 10: Save and Publish the Page

Save the changes to the page and publish it to make the product gallery live on your website.

Troubleshooting Tips:

• Missing Products: Double-check product visibility and availability in your store.


• Image Issues: Ensure images are properly sized and formatted.


• Layout Problems: Review your theme's documentation for potential conflicts or customization options.


 

If you encounter further issues, contact Storbie support.