Solved

How can I adjust the popup size and remove white space in my size chart?

Ben_10
Tourist
7 0 0

Screenshot 2024-02-13 at 14.04.05.png

 

Hi All,

 

This is my size chart in Motion Theme. I used the editor to insert the image and made the size to the original size but when I save it and have a look at it on my site it seems that it is still too small although in the actual editor it looks much bigger. No matter how much bigger I make the image this just seems to be the max popup size for the chart. I would like to make the popup bigger when people click the size chart, please let me know how I can do so?

Then secondly, the white space between the red boxes, how can I get rid of that so my image stretches out in full?

Accepted Solutions (2)
Zeel-prajapatii
Shopify Partner
138 32 27

This is an accepted solution.

Hey @Ben_10 please add the below css to your theme.css file.

 

tool-tip[data-tool-tip-open=true] .tool-tip__inner {
    max-width: 850px;
    min-height: 350px;
    min-width: 350px;
    padding: 0px;
}
.tool-tip__close {
    padding: 1px;
}

 

Thanks

➔ Was I helpful , please don't forget to like and mark solution as an accepted solution , you can PM me.
➔ Software engineer : Having more than 3 years of experience in the related industry with the specialization of Shopify theme development , worked on hundreds of stores.
➔ Want to hire me? Email me

View solution in original post

Zeel-prajapatii
Shopify Partner
138 32 27

This is an accepted solution.

@Ben_10 please change the max-width to 1250px; refer the below screenshot.

 

Zeelprajapatii_0-1707995285179.png

 

Thanks

➔ Was I helpful , please don't forget to like and mark solution as an accepted solution , you can PM me.
➔ Software engineer : Having more than 3 years of experience in the related industry with the specialization of Shopify theme development , worked on hundreds of stores.
➔ Want to hire me? Email me

View solution in original post

Replies 10 (10)

Zeel-prajapatii
Shopify Partner
138 32 27

Hey @Ben_10 Could you please give your website URL? It will make it much easier for me to address your problem.

 

Thanks

➔ Was I helpful , please don't forget to like and mark solution as an accepted solution , you can PM me.
➔ Software engineer : Having more than 3 years of experience in the related industry with the specialization of Shopify theme development , worked on hundreds of stores.
➔ Want to hire me? Email me
Ben_10
Tourist
7 0 0

Hi Zeel-Prajapatii,

 

I just removed the password to make the site live as it is not yet completed, please see link directly to the product page - https://www.grably.art/products/prehistoric-musing-i?variant=47628837126474

Once you click 'MEDIUM DETAILS & SIZE CHART' you will see the size issue plus the white spacing I assume is to do with the popup code.

Zeel-prajapatii
Shopify Partner
138 32 27

Hey @Ben_10 I'm not able to see any size chart image in the popup. could you please upload the image again so i can get the better idea for the size and spacing. https://prnt.sc/f_T9SU2l7-tS 

 

Thanks

➔ Was I helpful , please don't forget to like and mark solution as an accepted solution , you can PM me.
➔ Software engineer : Having more than 3 years of experience in the related industry with the specialization of Shopify theme development , worked on hundreds of stores.
➔ Want to hire me? Email me
Ben_10
Tourist
7 0 0

That is a bit strange as it works on my side. I deleted the image, then saved. Then re-uploaded it now and saved. Working my side, please let me know if you see it now.

Zeel-prajapatii
Shopify Partner
138 32 27

This is an accepted solution.

Hey @Ben_10 please add the below css to your theme.css file.

 

tool-tip[data-tool-tip-open=true] .tool-tip__inner {
    max-width: 850px;
    min-height: 350px;
    min-width: 350px;
    padding: 0px;
}
.tool-tip__close {
    padding: 1px;
}

 

Thanks

➔ Was I helpful , please don't forget to like and mark solution as an accepted solution , you can PM me.
➔ Software engineer : Having more than 3 years of experience in the related industry with the specialization of Shopify theme development , worked on hundreds of stores.
➔ Want to hire me? Email me
Ben_10
Tourist
7 0 0

Wow Zeel-Prajapatii thank you so much, this is great, the white borders are gone! The zoom issue is still there though as I would like the overall popup for the chart to be roughly 50% bigger, can you assist with that? Sorry I see replied in the wrong place at first.

Ben_10
Tourist
7 0 0

Wow Zeel-Prajapatii thank you so much, this is great, the white borders are gone! The zoom issue is still there though as I would like the overall popup for the chart to be roughly 50% bigger, can you assist with that?

Zeel-prajapatii
Shopify Partner
138 32 27

This is an accepted solution.

@Ben_10 please change the max-width to 1250px; refer the below screenshot.

 

Zeelprajapatii_0-1707995285179.png

 

Thanks

➔ Was I helpful , please don't forget to like and mark solution as an accepted solution , you can PM me.
➔ Software engineer : Having more than 3 years of experience in the related industry with the specialization of Shopify theme development , worked on hundreds of stores.
➔ Want to hire me? Email me
Ben_10
Tourist
7 0 0

Thank you so much! It is perfect now

MRamzan
Shopify Partner
165 2 24

You can try this method:

 

Hire Me:

WhatsApp: +91-9145985880
Email: mohdramzaan112@gmail.com
Skype: mohdramzaan112