niteshifte Posted January 9, 2023 Posted January 9, 2023 Hi there, Is there a way to reduce the spacing above the product title on product pages which include multiple images such as below? The spacing on all other product pages is fine. It is only an issue on pages where I have multiple images added to a product. Thanks!
Waqas_SQSPStarter Posted January 9, 2023 Posted January 9, 2023 @niteshifte. This Code will do the job for you. Add it in Design > Custom CSS @media screen and (max-width: 767px){ .ProductItem-gallery { padding-bottom: 25px !important; /* Play with the pixals here */ } } Let me know how it goes 🙂 niteshifte 1 Muhammad Waqas Web Expert - SQSP Starter Squarespace Designer & Customization Specialist 📧 waqas@sqspstarter 🌐 sqspstarter.com
niteshifte Posted January 9, 2023 Author Posted January 9, 2023 hey there! Thanks for all the quick replies, you have no idea how grateful I am!! So that code controls the space between the product image and the thumbnails below which is actually great as I needed that as well. What I was looking for however in this case was to control the spacing above the title and the thumbnails. Would you code to control this by any chance? Thanks so much!
niteshifte Posted January 9, 2023 Author Posted January 9, 2023 So basically I'd like the same spacing above the title as what I have on all the other single image products as you see below. It's important however that this is only changed on mobile as desktop is fine and that it only affects multiple image products.
Waqas_SQSPStarter Posted January 9, 2023 Posted January 9, 2023 @niteshifte can you share the URL? It will help me give you an exact code. You can share a password protected URL Muhammad Waqas Web Expert - SQSP Starter Squarespace Designer & Customization Specialist 📧 waqas@sqspstarter 🌐 sqspstarter.com
niteshifte Posted January 9, 2023 Author Posted January 9, 2023 hey there. So this is a product with multiple images which the spacing needs to fixed on: https://daisy-chiton-7gh8.squarespace.com/shop/p/cork-2023-calendar This is a single product which I want to match the spacing with: https://daisy-chiton-7gh8.squarespace.com/shop/p/framed-test-j2s27 Thanks again!
Solution Waqas_SQSPStarter Posted January 9, 2023 Solution Posted January 9, 2023 Thanks for sharing the URL. This code will work for you. @media screen and (max-width: 767px){ .ProductItem-gallery-thumbnails { margin-bottom: 15px !important; /* play with pixals here*/ } } Let me know how it goes 🙂 Muhammad Waqas Web Expert - SQSP Starter Squarespace Designer & Customization Specialist 📧 waqas@sqspstarter 🌐 sqspstarter.com
niteshifte Posted January 9, 2023 Author Posted January 9, 2023 again you've come to the rescue!!! Unreal. thanks!!! Waqas_SQSPStarter 1
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment