How to adjust image thumbnails on product listings?

[JessicaBradley]

Hi there!

New to Shopify, although well versed in html/css coding. Helping a client with her website, so I'm navigating draft product pages/theme designs as to not interfere with her E-commerce site.

Using Sense theme, and would like to adjust the way the photos are arranged in a product listing.

Screenshot below is the landing page of the product. (please don't mind my misspellings on the screenshots, oops!)

Below is a mockup of how I'd like it to be viewed, with the main variant photo as a highlight image, and thumbnails of additional content below. I'd like to hide the other variant listings as well, as shown in the original landing page of product.

Additionally, is there a way to get a line break between variants (For example in the screen shot, I'd like the 7mm-15mm to be on a new line just for a little separation). I also am noticing in this mockup that the price of the variants is not adjusting but perhaps its because I haven't entered the quantities?

Thanks in advance for an support!

[biznazz101 · Accepted solution]

You can try going to Themes> Customize> Product Template> Product Information> Desktop Layout> Thumbnail Carousel

I hope that helps!
@biznazz101