april_tak Posted January 13, 2023 Share Posted January 13, 2023 Hi @tuanphan, my page has the same issue. I've tried all codes above but it's not helping. Please find the page here: https://www.redressdesignaward.com/home Thanks in advance for the help!! Link to comment
tuanphan Posted January 15, 2023 Share Posted January 15, 2023 On 1/13/2023 at 10:30 AM, april_tak said: Hi @tuanphan, my page has the same issue. I've tried all codes above but it's not helping. Please find the page here: https://www.redressdesignaward.com/home Thanks in advance for the help!! You mean this gallery? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
april_tak Posted January 30, 2023 Share Posted January 30, 2023 @tuanphan yes, that's the gallery which crop the images Link to comment
tuanphan Posted February 1, 2023 Share Posted February 1, 2023 On 1/30/2023 at 5:21 PM, april_tak said: @tuanphan yes, that's the gallery which crop the images Hi. It looks like you solved with this code? @media only screen and (max-width: 640px) { .sqs-gallery-block-slideshow{ height:30vh !important;} .sqs-gallery-block-slideshow img{ width:50%} .sqs-gallery-block-slideshow .meta { display: block !important; position: absolute; background: #fff; width: 100vw; min-height: 300px !important; left: 0px; top: 30vh; max-width: 100% !important; z-index:0; } .sqs-gallery-block-slideshow .meta-title { color:rgb(84,84,84) !important; text-align: center; font-size:20px !important; padding-bottom:25px; } .sqs-gallery-block-slideshow .meta-description p, .sqs-gallery-block-slideshow .meta-description a { color:rgb(84,84,84) !important; text-align: justify; font-size:16px !important; } #block-yui_3_17_2_6_1488331956550_8686 { padding-top:300px !important; z-index: -1 !important; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
april_tak Posted February 2, 2023 Share Posted February 2, 2023 On 2/1/2023 at 2:53 PM, tuanphan said: Hi. It looks like you solved with this code? @media only screen and (max-width: 640px) { .sqs-gallery-block-slideshow{ height:30vh !important;} .sqs-gallery-block-slideshow img{ width:50%} .sqs-gallery-block-slideshow .meta { display: block !important; position: absolute; background: #fff; width: 100vw; min-height: 300px !important; left: 0px; top: 30vh; max-width: 100% !important; z-index:0; } .sqs-gallery-block-slideshow .meta-title { color:rgb(84,84,84) !important; text-align: center; font-size:20px !important; padding-bottom:25px; } .sqs-gallery-block-slideshow .meta-description p, .sqs-gallery-block-slideshow .meta-description a { color:rgb(84,84,84) !important; text-align: justify; font-size:16px !important; } #block-yui_3_17_2_6_1488331956550_8686 { padding-top:300px !important; z-index: -1 !important; } } Hi @tuanphan, the code is added, but the problem remains. So NO, the issue has yet to be solved. Link to comment
Loribo Posted February 19, 2023 Share Posted February 19, 2023 Hi @tuanphan, I'm having the same issue for two SquareSpace artist sites that I'm building. I've tried all of the solutions that you suggested with no luck for the store product gallery (the store landing page). I did get the product detail pages working with this code: img.ProductItem-gallery-slides-item-image { object-fit: contain !important; } Here are the two sites - the images on the product store page are cropped, but product detail pages are ok: https://www.madjello.com/julia https://www.andreawilkinsonfineart.com/ Thanks!! Lori Link to comment
tuanphan Posted February 21, 2023 Share Posted February 21, 2023 On 2/20/2023 at 4:40 AM, Loribo said: Hi @tuanphan, I'm having the same issue for two SquareSpace artist sites that I'm building. I've tried all of the solutions that you suggested with no luck for the store product gallery (the store landing page). I did get the product detail pages working with this code: img.ProductItem-gallery-slides-item-image { object-fit: contain !important; } Here are the two sites - the images on the product store page are cropped, but product detail pages are ok: https://www.madjello.com/julia https://www.andreawilkinsonfineart.com/ Thanks!! Lori Use this code for store page .products.collection-content-wrapper .grid-item img { object-fit: contain !important; } Loribo 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Loribo Posted February 21, 2023 Share Posted February 21, 2023 Thank you SO much @tuanphan - that worked!!! Lori Link to comment
Mary_DG Posted June 14, 2023 Share Posted June 14, 2023 Hello Tuanphan, URL: https://formebar-sample.squarespace.com/ PW: HC I am trying to keep the image intact without the need to scroll. But want it on full bleed, you will see that there is header and the image below it is cropped. See attached. I am hoping to achieve this from reference site: https://www.pickuplimes.com/ where it has header and then image that ends before you scroll down the page. So, 1, i am thinking need to decrease height of header? 2, also need how to add caption on the image on same place as reference site? Link to comment
tuanphan Posted June 15, 2023 Share Posted June 15, 2023 On 6/14/2023 at 9:38 AM, Mary_DG said: Hello Tuanphan, URL: https://formebar-sample.squarespace.com/ PW: HC I am trying to keep the image intact without the need to scroll. But want it on full bleed, you will see that there is header and the image below it is cropped. See attached. I am hoping to achieve this from reference site: https://www.pickuplimes.com/ where it has header and then image that ends before you scroll down the page. So, 1, i am thinking need to decrease height of header? 2, also need how to add caption on the image on same place as reference site? Something like this? With reference site, I see it has issues with layout. Can you check it again? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Mary_DG Posted June 15, 2023 Share Posted June 15, 2023 Hello Tuanphan, Here is the full image:If i use this and use gallery, slideshow full: it will crop the top and the bottom of the image. see:https://www.hellocinnamon.com/homepage-1 I am hoping to retain the size of the image also keep the size intact on mobile. thank you in advance. Link to comment
tuanphan Posted June 19, 2023 Share Posted June 19, 2023 On 6/15/2023 at 3:06 PM, tuanphan said: Something like this? With reference site, I see it has issues with layout. Can you check it again? You mean make image behind header like this + make image fullsize? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Fae Posted July 10, 2023 Share Posted July 10, 2023 I am also having this issue and have not been able to find any code that will fix it @tuanphan Can you help? https://helix-tunny-psaf.squarespace.com/ pass: 321 Link to comment
tuanphan Posted July 10, 2023 Share Posted July 10, 2023 23 minutes ago, Fae said: I am also having this issue and have not been able to find any code that will fix it @tuanphan Can you help? https://helix-tunny-psaf.squarespace.com/ pass: 321 You mean top image on homepage on mobile? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Fae Posted July 10, 2023 Share Posted July 10, 2023 42 minutes ago, tuanphan said: You mean top image on homepage on mobile? no, on the gear page the reel gallery images are cropping themselves Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment