All Collections
Visual Shopping
Shoppable Galleries
How to add Shoppable Galleries to any page of your website or webstore
How to add Shoppable Galleries to any page of your website or webstore

A step-by-step guide to adding shoppable galleries and social proof to your online store, landing pages, and sales funnels.

Guy Schragger avatar
Written by Guy Schragger
Updated over a week ago

Amplify Purchase Confidence with Visual Shopping

Integrating visual shopping enriches your webstore, offering diverse shopping avenues. Incorporate Influencer Marketing, utilising content from influencers and User Generated Content (UGC) to add Social Proof and bolster your content strategy. When customers experinece your products in real-life scenarios through others' photos and videos, it raises their Purchase Confidence, making them more inclined to buy. This display of Social Proof—micro endorsements from customers—significantly enriches your brand's credibility and appeal.

There are 5 key types of Visual Shopping experiences brands using Sauce can add to their store:

  1. Shoppable Galleries
    Explore a variety of display styles with Shoppable Galleries. Whether it's Grid, Carousel, or Mosaic, effortlessly incorporate these visually engaging collections of photos and videos onto your homepage, collection pages, landing pages, and lookbooks. Enhance your site's visual appeal, product discovery and shopping experience by adding a touch of interactive elegance with shoppable media galleries.

  2. Video Commerce Galleries:
    Dive into a realm of video player and gallery styles with Video Commerce Galleries. Whether it's one of many Grid layouts, Video Carousel, or Video Shop the Look cards, effortlessly embed these on your site. Source videos from Instagram, TikTok, your own uploads, User Generated Content (UGC), or influencers to enrich your homepage, collection pages, landing pages, and lookbooks. Amplify visual allure, product discovery, and interactive shopping, fostering a vibrant, engaging user experience.

  3. Product Page Galleries
    Experience an auto-filtered, product-centric display of photos and videos on your Product Page template, styled as a Grid, Carousel, or Mosaic layouts. This dynamic collection automatically showcases only the media related to the product your customer is currently viewing, ensuring a tailored visual exploration that enhances user engagement and complements the shopping experience.

  4. Shop the Look Cards
    Optimise your editorial content with Shop the Look Cards. Transform static images on blog articles, editorial pages, or website sections into interactive shoppable photo or video cards. By replacing mere visuals with "interactive shoppable images and videos", you invite your audience into an engaging shopping experience right within the narrative. Elevate user interaction and seamlessly bridge content with commerce.

  5. Loop Clips
    Integrate a socially-styled reels gallery into your website's header with Loop Clips, showcasing the cream of your video content. This feature not only enhances dwell time but also fosters product discovery and in-context shopping. By presenting your best videos from Instagram or TikTok in an engaging reel, you invite visitors to explore, stay longer, and shop directly within the visual narrative.

This article explains how to add Shoppable Galleries to your store:

1. Shoppable Galleries

This is an example of a shoppable gallery using the 'Grid' style

When a customer clicks on one of the images or videos in the grid they see the 'lightbox' view containing tagged products in the image with direct links to buy them from their product pages.

Getting started with Shoppable Galleries

  1. In your dashboard click on the top menu:
    Shop the Feed > select Shoppable galleries

2. Get the look you want

Within the left-hand settings menu, you can customise the gallery's display settings and appearance.

Instant Preview: Settings and Reflections

Edit settings on the left to see the transformation in the preview on the right, making adjustments a breeze. For instance, modifying the number of columns in the gallery is visually represented in real-time on the right. This intuitive setup allows for immediate feedback, ensuring your gallery is tailored to perfection before going live.

Interactive Image Preview

Every image is clickable, offering a preview of the customer's view in your store. This feature allows you to step into your customers' shoes, ensuring that what you present aligns with how you wish to showcase your products. Explore and click through to fine-tune your gallery, ensuring a seamless shopping experience for your audience.

Dynamic Video Previews:

Not just static images, videos too come to life in the previews. This feature allows you to experience the playback, ensuring your videos are displayed to perfection. It’s all about providing a realistic glimpse of how videos will interactively engage your customers, enhancing the vibrancy and appeal of your gallery even before it goes live on your site.

3. Embedding the Gallery on Your Website

Transitioning your gallery onto your website is a straightforward process. Simply copy the provided embed code, which is primed for embedding, and paste it onto any desired page of your website. This step is the bridge that takes your curated gallery from the Sauce platform to your website.

4. Seamless Gallery Embedding and Updates

Paste the embed code into your webpage's HTML box, then save the page. Now, browse it live on your site's front end. Any gallery updates made in Sauce will reflect automatically on your webpage, without needing a new embed code. This seamless update mechanism ensures your gallery remains current with every tweak, effortlessly reflecting all changes on your live webpage.

Example below shows Shopify's page editor:

Continuous Gallery Updates and Design Tweaks

Your gallery dynamically updates as you add more shoppable photos and videos. For design alterations, simply adjust settings within your Shoppable Galleries editor; there's no need to update the embed code. Your changes will auto-reflect wherever the widget is embedded, maintaining a fresh, engaging gallery without any additional embedding steps, making your gallery a living aspect of your webpage that evolves with your content.

Did this answer your question?