Creating a Product Gallery

FooGallery Documentation

Creating a Product Gallery

FooGallery PRO Commerce includes a product gallery template, allowing you to set up your commerce gallery quickly and efficiently. Here we take a look at how to do this, and some of the features included in the product gallery.

The Product Gallery template is exclusive to FooGallery PRO Commerce and is designed specifically for online stores. The main focus is on creating a stunning gallery to showcase your products while making it simple for customers to find (and buy) the items they want.

To accomplish this, the product gallery layout utilizes various settings by default. For example, it automatically adds filtering by product catalogue and includes an Add to Cart button. You also have the option of displaying Sale Ribbons, adding product pricing and more. Of course, you can change any of these settings to suit your needs.

Building A Product Gallery

The easiest way to build your product gallery is to create dynamically by loading images from WooCommerce. For this, you would need to set up your products in WooCommerce, and then add media from WooCommerce. This ensures that your filters match your product galleries and automatically adds sales ribbons to relevant items. It also means that your pricing, captions and descriptions are all automatically filled in from your products, so you don’t need to do this manually.

However, it is possible to create a product gallery manually. Below is an example of a product gallery that we built without using WooCommerce. In this scenario, you can add the necessary details to the images by filling in the caption, description, or other fields when the image is uploaded. You are also able to manually insert Sale Ribbons in this way. Plus you can add a button, and a button URL, for adding items to the cart.

Product Gallery Features

The product gallery layout is geared towards helping you sell your images. To accomplish this, it comes with several settings built-in. This include:

  • Filtering – your gallery will use product categories for frontend filtering. When usig WooCommerce, these filters will pull from your WooCommerce products.
  • Buttons – an Add to Cart button can display in both your gallery and in the lightbox, making it easy for customers to place items in their shopping cart.
  • Pricing – you can choose to display the product prices as your caption or description.
  • Sale Ribbons – highlight which products are on sale by adding a ribbon to your image. There are several different options to choose from. WooCommerce product galleries will identify promotional items from your WooCommerce settings.
  • Product variations – If you have variations of a specific product in WooCommerce, these will display in the lightbox. Customers can select the variation they want to add to the cart.