BajanCode Posted June 14 Posted June 14 Hello! I'm working on a client's blog (currently not published) and she really doesn't like the huge size of her H2-H4 for her blog posts. While I'm able to use assign custom styles to decrease their size without doing it globally, I checked the code and they lose their "H2, H3, H4" status. Because we are doing the blog partially for SEO purposes, I feel we'll lose out on a lot of opportunities if we're losing these. Is there any code I could do instead? I tried doing various class and ID selectors so I could change just the size for blog posts, while keeping the H's, but not a single one worked. I'm not sure why, I couldn't seem to select anything. Is there some sort of trick for selecting things with HTML or CSS in the blogs? A few approaches I tried: Selecting the h2 titles of certain sections section[data-section-id="63cff1814c84ba211416e2ff"] h2 { font-size: 1.5rem ; } Selecting the h's of specific divs #yui_3_17_2_1_1718391594494_5333 h2, #yui_3_17_2_1_1718391594494_5333 h3, #yui_3_17_2_1_1718391594494_5333 h4 { font-size: 1.5rem !important; } I tried putting each of these separately in both Page Header Code Injection and then Post Blog Item Code Injection And no luck. I've never had a problem using different methods to select things for CSS on "regular" Squarespace pages, so I wonder if I'm missing something? Thank you!
tuanphan Posted June 16 Posted June 16 To target h2 on blog posts, you can use this [class*="type-blog"] h2 { font-size: 20px !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!)
BajanCode Posted June 18 Author Posted June 18 Thank you so much! I didn't have any luck. Here's an example of an H3. I tried to change it to 5px just to see if it would get teeny tiny and I could know if I was selecting it, but the size didn't change. I tried putting the code (modified from h2 to h3) in both the page header code injection and post blog item code injection, see below example: any ideas?
tuanphan Posted June 20 Posted June 20 With Post Blog Item Code Injection, you need to use style tag <style> [class*="type-blog"] h3 { font-size: 20px !important; } </style> 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!)
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment