Hyde Template Product Images being cut off

Hi Everyone, I'm using the Hyde Template for a clients online store to see their fine art from but the store images are being cut off due to there not being an option to show the artwork without cropping it?

Normally there is an option to crop or uncrop images in a gallery, but there only seems to be limited image display options in the Style Editor for product listings?

I've had to change the products page to square view to correctly show some round art, but when a product is clicked through the edges are cut off and for tall, thin images, the top an bottoms are cut off?

Does anyone know how this can be fixed so that the main image shows all of the artwork?

Otherwise I'll have to create a square image and past the main image in that with white edges to force the whole piece to view correctly?

The website is www.marilyngough.com if you need to take a look to see what I mean.

Many thanks in advance :0)

Can you share link to product in screenshot?

Hi tuanphan,

Here is a URL to one of the products:

http://marilyngough.squarespace.com/the-pittville-collection-products/luna-rising-i

2 hours ago, jasonconway said:

Hi tuanphan,

Here is a URL to one of the products:

http://marilyngough.squarespace.com/the-pittville-collection-products/luna-rising-i

Add to Home > Design > Custom CSS

.ProductItem-gallery-slides-item.sqs-pdp-gallery-slide-active img {
    width: 100% !important;
    left: 0 !important;
}

On 1/2/2020 at 5:41 AM, tuanphan said:

.ProductItem-gallery-slides-item.sqs-pdp-gallery-slide-active img { width: 100% !important; left: 0 !important; }

Hi @tuanphan! We are also having similar issues with our product shots. Is there a way we can get all of the shots to not be cut off? Here is an example URL of this happening (when you click on the 10 Bag option, the picture is cut off): https://www.enjoysnacks.com/shop/candies/big-sour-apple. Any help would be appreciated!

58 minutes ago, galangster said:

Hi @tuanphan! We are also having similar issues with our product shots. Is there a way we can get all of the shots to not be cut off? Here is an example URL of this happening (when you click on the 10 Bag option, the picture is cut off): https://www.enjoysnacks.com/shop/candies/big-sour-apple. Any help would be appreciated!

Try this CSS

.ProductItem-gallery-slides img {
    left: 0 !important;
    width: 100% !important;
}

6 minutes ago, tuanphan said:

.ProductItem-gallery-slides img { left: 0 !important; width: 100% !important; }

@tuanphanAwesome! Is there a way to just have it fit without stretching/shrinking the image? If you click on the same link, the bags looked smaller, if that's makes sense.

On 1/2/2020 at 9:41 AM, tuanphan said:

Add to Home > Design > Custom CSS

.ProductItem-gallery-slides-item.sqs-pdp-gallery-slide-active img {
    width: 100% !important;
    left: 0 !important;
}

 

On 6/17/2020 at 3:28 PM, galangster said:

Hi @tuanphan! We are also having similar issues with our product shots. Is there a way we can get all of the shots to not be cut off? Here is an example URL of this happening (when you click on the 10 Bag option, the picture is cut off): https://www.enjoysnacks.com/shop/candies/big-sour-apple. Any help would be appreciated!

Hi @tuanphan! I am also having an issue with rounded corners on images, but in our Instagram feed block.  Do I make this adjustment in the Design > Custom CSS settings? If so, I can't figure out what selector to use. Attaching screenshots and URL at the end of this post. The Instagram feed section I'm talking about is on the homepage just above the footer.

URL: https://renovationsells.com/ 

On 9/11/2020 at 3:10 AM, Goneuphoric said:

 

Hi @tuanphan! I am also having an issue with rounded corners on images, but in our Instagram feed block.  Do I make this adjustment in the Design > Custom CSS settings? If so, I can't figure out what selector to use. Attaching screenshots and URL at the end of this post. The Instagram feed section I'm talking about is on the homepage just above the footer.

URL: https://renovationsells.com/

Seems fine. Can you describe in detail???