Help making embedded image responsive and the correct size

Store Design
, , ,
1

Hi!

I am in the middle of building my store. I have a collapsable row that includes an embedded Metafield of an image relating to that specific product. I’ve managed to get this to work, however the image isn’t the right size, its as if its too big and its been squeezed into a smaller space.

How do I get this to be responsive and change to the space?

This is the product page I’m testing on:

https://swanstreet.co.uk/products/uno-reverse

You can see under ‘size guide’ how the image looks.

Any help would be amazing!!

Thank you!

2 Likes
2

Hello @SwanStreet

We can display this in a popup so that it looks proper.

devcoders_0-1736362423306.png
devcoders_0-1736362423306.png1303×628 176 KB

3

Hey @SwanStreet

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1736363689057.png
Moeed_0-1736363689057.png1450×867 130 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

4

Thank you for replying! That didn’t seem to work unfortunately though, any other ideas?