POA Posted February 16, 2021 Share Posted February 16, 2021 (edited) Looking to hide my product page thumbnails but keep product detail pages still active in 7.1. This is because I'm using a gallery block to 'showcase' the products and adding the product details page URL to the gallery images instead. So, I just want to use the product details pages but not have the thumbnails show on my store page. Any idea if possible/advice on code I can use for this? Edited August 8, 2021 by POA Link to comment
ArminB Posted February 16, 2021 Share Posted February 16, 2021 Hi, that can be done with a little CSS what's the direct link to your product page you're referring to? POA 1 About Armin:Squarespace Expert Profile: https://www.squarespace.com/designer/profile/3649084Website: www.braunsberger-media.comLeaders Lodge: See my Profile Link to comment
POA Posted February 16, 2021 Author Share Posted February 16, 2021 (edited) Amazing! Edited August 8, 2021 by POA Link to comment
ArminB Posted February 17, 2021 Share Posted February 17, 2021 Hello, try: .grid-image {display: none !important} this should do it About Armin:Squarespace Expert Profile: https://www.squarespace.com/designer/profile/3649084Website: www.braunsberger-media.comLeaders Lodge: See my Profile Link to comment
ArminB Posted February 17, 2021 Share Posted February 17, 2021 PS: apply it site-wide: DESIGN > CUSTOM CSS apply it only to this page > PAGE SETTINGS (gear wheel icon) and ADVANCED > HEADER CODE INJECTION and then you'd need to add <style> CSS </style> POA 1 About Armin:Squarespace Expert Profile: https://www.squarespace.com/designer/profile/3649084Website: www.braunsberger-media.comLeaders Lodge: See my Profile Link to comment
POA Posted February 17, 2021 Author Share Posted February 17, 2021 SO helpful, thank you! It worked to remove the gallery thumbnails. The section block remains as a blank. Any thoughts on removing, or reducing space here? Link to comment
ArminB Posted February 17, 2021 Share Posted February 17, 2021 That's a bit more complex. You could hire somebody through the marketplace:https://www.squarespace.com/designer/home POA 1 About Armin:Squarespace Expert Profile: https://www.squarespace.com/designer/profile/3649084Website: www.braunsberger-media.comLeaders Lodge: See my Profile Link to comment
POA Posted February 17, 2021 Author Share Posted February 17, 2021 Ok np, thanks for the help! Link to comment
tuanphan Posted February 19, 2021 Share Posted February 19, 2021 Do you still need help on this? POA 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
POA Posted February 19, 2021 Author Share Posted February 19, 2021 No I don't, thank you! Link to comment
sambatista Posted August 24, 2021 Share Posted August 24, 2021 On 2/17/2021 at 1:41 AM, ArminB said: Hello, try: .grid-image {display: none !important} this should do it @ArminB I've been trying to implement this, but every time I add the code to either the main custom CSS or the shop's individual code, all my products disappear. Do you have any clue as to what could be causing this? Site: https://tunny-bobcat-bnz8.squarespace.com/currexample2 Password: arminbhelp Link to comment
creedon Posted August 24, 2021 Share Posted August 24, 2021 (edited) 36 minutes ago, sambatista said: I've been trying to implement this, but every time I add the code to either the main custom CSS or the shop's individual code, all my products disappear. Do you have any clue as to what could be causing this? The code is designed to do exactly that. Hide the product grid images. If you don't want to hide the product grid images what effect are you trying to achieve? Edited August 24, 2021 by creedon Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
sambatista Posted August 24, 2021 Share Posted August 24, 2021 8 minutes ago, creedon said: The code is designed to do exactly that. Hide the product grid. If you don't want to hide the product grid what effect are you trying to achieve? What was mentioned above: hide only the thumbnails but leave the product name and price. Link to comment
creedon Posted August 24, 2021 Share Posted August 24, 2021 @sambatista Is this what you are seeing when you apply the code? Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
sambatista Posted August 24, 2021 Share Posted August 24, 2021 @creedon Negative. I see nothing. But I can tell there's something there because my cursor changes when I hover over the different areas where the products would be. Link to comment
creedon Posted August 24, 2021 Share Posted August 24, 2021 @sambatista I just looked at your site and I see the symptom of the issue. If you could leave the code in place while I investigate, that would be grand! Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
creedon Posted August 24, 2021 Share Posted August 24, 2021 @sambatista It appears SS has changed how the backend works so the previous code no longer works. Add the following to Store Settings > Advanced > Page Header Code Injection for the store page. <style> /* begin store product grid images hide Version : 0.1d0 SS Version : 7.1 By : Thomas Creedon < http://www.tomsWeb.consulting/ > */ .products.collection-content-wrapper .grid-item { opacity : 1; } .products.collection-content-wrapper .list-grid .grid-item .grid-image { display : none; } /* end store product grid images hide */ </style> Let us know how it goes. sambatista 1 Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
sambatista Posted August 24, 2021 Share Posted August 24, 2021 24 minutes ago, creedon said: @sambatista It appears SS has changed how the backend works so the previous code no longer works. Add the following to Store Settings > Advanced > Page Header Code Injection for the store page. <style> /* begin store product grid images hide Version : 0.1d0 SS Version : 7.1 By : Thomas Creedon < http://www.tomsWeb.consulting/ > */ .products.collection-content-wrapper .grid-item { opacity : 1; } .products.collection-content-wrapper .list-grid .grid-item .grid-image { display : none; } /* end store product grid images hide */ </style> Let us know how it goes. Creedon, you're a genius my friend! I can't thank you enough! One thing though: would it be possible to make it only "clickable" where the text appears, instead of the whole "cell" within the grid? See below screenshot to understand what I mean. creedon 1 Link to comment
creedon Posted August 25, 2021 Share Posted August 25, 2021 1 hour ago, sambatista said: One thing though: would it be possible to make it only "clickable" where the text appears, instead of the whole "cell" within the grid? That appears to be a bit trickier. SS has set up the link as a kind of overlay that covers the whole cell. I don't see a totally clean way with CSS only to get your desired effect. You could try something like the following to get close but I don't know how responsive it would be. <style> .products.collection-content-wrapper .grid-item-link { width : 8em; } </style> This is changing the width of the link overlay to about 8 characters wide. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
sambatista Posted August 25, 2021 Share Posted August 25, 2021 @creedon I appreciate your hotfix! I don't know much JavaScript myself, but I'll try to play around with it and see what I can accomplish. Thank you so much! creedon 1 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