Mule Horse Posted January 12, 2016 Share Posted January 12, 2016 (edited) Does anyone know how to change the background color on a specific index page? I'm able to change the background color on the individual page using: .collection-[id] #siteWrapper {background-color:#ccc !important; However, when viewing this page as part of an index, it defaults back to the original color. This is using the Hayden template. Edited January 12, 2016 by Mule Horse LilyTran 1 Link to comment
Solution CSmith333 Posted January 14, 2016 Solution Share Posted January 14, 2016 To start with this you will need to use the slug of the page in the Index you want to adjust as the id (after the #) will use the page slug. For example, if your page slug was named home, you could use this code in the main custom CSS tab. .collection-type-index #home {background:red} Link to comment
Mule Horse Posted January 14, 2016 Author Share Posted January 14, 2016 Thank you so much! This worked. Link to comment
brandsweet Posted July 9, 2017 Share Posted July 9, 2017 THANK YOU! I've just spent about 2 hours trying to figure this out and your line worked for me on the Hyde template Link to comment
brandy Posted March 16, 2018 Share Posted March 16, 2018 YASSS!!! Thank you so much! This post needs to be bumped up higher, and probably deserves a blog post or tutorial or something. Here's the code I used: .collection-type-index #who-we-serve { background-color: #e8eddb, !important; } @csmith333 How did you know to target .collection-type-index ? I don't remember seeing that anywhere when I was looking at the code using Google dev tools. Is there some super secret master list of all Squarespace selectors somewhere? Link to comment
sequoiac Posted February 24, 2021 Share Posted February 24, 2021 (edited) Help!!! What am I doing wrong? It looks correct in the Squarespace builder but when I go to check it on another device it's not working... Quote .collection-602aa939c1889644fc2abcc1 #pe-class{ background: #E5E2DA !important } @CSmith333 @brandy Edited February 24, 2021 by sequoiac Link to comment
sequoiac Posted February 24, 2021 Share Posted February 24, 2021 On 1/20/2021 at 4:35 PM, bangank36 said: Could you share your site url? It's rough around the edges because I'm still in creation mode. But it's ferret-drum-ndgp.squarespace.com password erika Link to comment
sequoiac Posted February 24, 2021 Share Posted February 24, 2021 2 minutes ago, sequoiac said: It's rough around the edges because I'm still in creation mode. But it's ferret-drum-ndgp.squarespace.com password erika And ferret-drum-ndgp.squarespace.com/services is the index I'm talking about. @bangank36 Link to comment
Beyondspace Posted February 25, 2021 Share Posted February 25, 2021 On 2/25/2021 at 1:15 AM, sequoiac said: And ferret-drum-ndgp.squarespace.com/services is the index I'm talking about. @bangank36 which section you want to change color and the color code you needed? BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox) 🗓️ Delivery Date Picker (Squarespace Date format) 💫 Animated Buttons (Referral URL) 🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations) 🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
sequoiac Posted February 26, 2021 Share Posted February 26, 2021 22 hours ago, bangank36 said: which section you want to change color and the color code you needed? Most of the sections have color changes. #pe-class { background-color: #E5E2DA; } #coaching { background-color: #E9C262 !important; } #type-confident{ background-color: #8D623F !important; } #ewe{ background-color: #C883A3 !important; } Link to comment
creedon Posted February 27, 2021 Share Posted February 27, 2021 @sequoiac 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
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment