supasmilez Posted June 25, 2022 Share Posted June 25, 2022 Site URL: http://www.readersinspired.com Hi everyone! I hope you are well. I am a bit stuck at the moment. I am looking for a way to use a custom CSS font and design of summary items and title on my site in a way that only affects pages under a specific folder (in my cause the "+Shop African Books," folder which include the following pages): West Africa East Africa North Africa Central Africa Southern Africa Non-Country Specific Pan African However the code I put in the the Design -> Custom CSS section of Squarespace (see below) has resulted in a global change of all summary items and titles. Is there a way this change to only affect the pages in the "+Shop African Books" folder and not additional parts of the site outside of this folder like it currently is now: .summary-title {font-family:Serif; font-size: 1.5rem!important} .summary-title {font-weight:bold} .summary-item {box-shadow:5px 5px 15px #ddd} .summary-item:hover {box-shadow:5px 5px #aaa} Link to comment
Solution creedon Posted June 25, 2022 Solution Share Posted June 25, 2022 There are several ways to go. You can use per-page code injection. Wrap your CSS in a style tag. You can keep the CSS in Design > Custom CSS but make the selectors more specific. Check out Heather Tovey's most excellent looking Squarespace ID Finder for a way to determine which elements you can target. For your case you could target a whole page or individual blocks. Let us know how it goes. tuanphan 1 Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
supasmilez Posted June 28, 2022 Author Share Posted June 28, 2022 Hi @creedon - Your tip worked! I ended up using the last option (targeting specific element)! Thanks 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