**SLIDESHOWS - How to change the images in a slide show for each product page

Store Design

Topic summary

Topic: Customizing a product page slideshow in the Shopify Symmetry theme to show different customer photos per product and reduce its size on desktop.

Current issues:

  • The same slideshow images appear on all product pages.
  • The desktop slideshow renders excessively large.

Key guidance:

  • Template settings apply uniformly across all pages using the same template. To vary content per product, either create alternate templates for those products or use metafields with dynamic sources in an Online Store 2.0 (OS2.0) section.
  • Metafields/dynamic sources let each product pull its own data (e.g., images in product description, media, or metafields) so the slideshow content changes based on the product being viewed.
  • A temporary CSS fix was suggested to reduce size: .rimage-background.fade-in.lazyloaded { width: 50%; }.
  • A more robust fix is to edit the slideshow’s Liquid template to serve smaller images.

Outcome/Status:

  • No final resolution; implementation steps were outlined. Customization help was offered. Discussion remains open.
Summarized with AI on February 7. AI used: gpt-5.
1

Hello, ill start with the website link - https://mydestinyapparel.com.au / THEME - Symmetry

This is not regarding the product images themselves. This is for an added slide show on the product page.

On the product pages i wanted to add a slideshow of customer pictures I’ve been sent under the description.

I’ve experienced 2 issues.

  1. The same pictures are showing up on ALL product pages. I’m wanting to use different photos in the slideshow for each product.

  2. The Desktop site slide show is Enormous! it is that big, the screen is just of the persons arm! lol How can i reduce this size down dramatically?

I’ve searched high and low, tried some apps - they were a waste of time and money. Please help!

2

Hello, @Nikkibrown If you need this customized to your need you can contact me, info in signature, please provide context.

Settings you add in a template is shown in the same exact way for every resource(product,collection,page,etc) that uses that same template.

Such as if you want to show buttons for variants for some products versus dropdowns for other products in some themes it would take two differently setup templates.

So if using only templates you’d have to make an alternate template for every product you want to have different settings.

The exception is If using metafield definitions ,and the slideshow is in an OS2.0 section capable of it, then in the templates themes setting you use dynamic sources which will swap info in based on what product is being viewed to that products metafields.

https://help.shopify.com/en/manual/online-store/themes/theme-structure/sections-and-blocks#using-metafields-and-dynamic-sources

To have different content automatically then that information needs to exist somewhere in the resources own data|CMS such as in each products description, it’s media, or a metafield definition; and the theme has to be built to display that information properly.

  1. The Desktop site slide show is Enormous! it is that big, the screen is just of the persons arm! lol How can i reduce this size down dramatically?

A bandaid CSS fix:

.rimage-background.fade-in.lazyloaded { width: 50%;}

But more likely the slideshow liquid template needs to be edited to server smaller images.