Product Gallery

Introduction

The product gallery displays photos of your customers using that product on that product's page. You install it once on your product page's template. The gallery is mobile and tablet friendly.

When customers click on a photo, it pops open a modal and display a large image of the photo. Further clicking on it will take the customer to either the Instagram page or the uploaded image link.

Installation

Unlike a page gallery, where you install the gallery on the pages that you want, you install the product gallery once but it appears on all your products page. Socialphotos knows that what product page it's on and will display those photos accordingly.

  1. Go to your product page
  2. Click on Install to get the code

You need to install it on your product.liquid page for the product gallery to work.

Alignment

The gallery will automatically adjust and center-align with the number of photos you have. For example, below is a gallery with only 3 images.

Layout

You can embed the gallery anywhere on the page. The gallery will take 100% of the width that it is allocated to. So, if you want the gallery in a two column page, you just have to embed the gallery within that column.

The gallery is embedded on the right column of this 2 column layout section. The code looks like this:


<div class="row">
<div class="col-6">
<div class="socialphotos-com-gallery slpht-clearfix" data-id="38133183">
</div></div>

Next Steps