Help with Product Image Padding - Venture Theme

[whiskeyworks]

Hello all!

So I've been messing around and managed to do part of what I wanted - moving the thumbnails to below my featured/main product image and altering the arrows, but now I have another issue.

I prefer how the spacing on my product pages look with just one image because the description is wider and easier to read in my opinion. But when I have the extra images the thumbnail bar ends up pushing into that space and squishing the text side down. Is there a way to limit the width of the thumbnail bar to the width of the displaying product photo? Or remove some of the padding to the left side of the screen to give my text it's space back? Photos below!

[AvadaCommerce]

Hi @whiskeyworks ,

Please share your store URL and if your store is password protected then please provide password too.

So that we can help you.

Thank you.

[whiskeyworks]

This is my direct shop link https://whiskey-works.myshopify.com/

Direct links to the two product samples I'm working with as well since Ive made lots of categories for planned products

https://whiskey-works.myshopify.com/products/mile-high-club-leather-collar

https://whiskey-works.myshopify.com/products/hawks-test

Thank you!

[AvadaCommerce · Accepted solution]

Hi @whiskeyworks ,

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss->paste below code at the bottom of the file:

@media (min-width: 750px) {
.template-product .product-single > .grid__item {
     width: 50% !important;
    -ms-flex-preferred-size: 50% !important;
    -webkit-flex-basis: 50% !important;
    -moz-flex-basis: 50% !important;
    flex-basis: 50% !important;
}
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

[whiskeyworks]

Yes! It works perfectly, thank you so much for your help!

[bittybee]

I am having an issue since I changed the images layout from vertical to horizontal where when I click through the image thumbnails at the bottom, those images open up in a separate window instead of just changing the main image on top. As I click each thumbnail at the bottom, the main image should display that specific thumbnail image. Is there a solution to this?

URL: https://competitionwerks.myshopify.com/collections/kline-innovation/products/testing-porsche-996-tur...