cox_co Posted February 17 Share Posted February 17 Hi, please could someone provide me with the appropriate code for adjusting the type style inside a Summary Block of blog posts. I am using them like a list of profiles, with each blog post as the full profile of the artist. Screen shot shows some content in the summary block - the Title of each blog post is the artist name. I would like to change the style of the Title of each blog post displayed in the summary block to use a Heading style, such as a H4, instead of the current style which appears to be a paragraph style. Or, at the very least to change the font so that it uses the heading fonts, which are shown in the hidden blog page listing attached - the heading typeface displays in all upper case. Thanks! Link to comment
tuanphan Posted February 18 Share Posted February 18 Can you share link to page where you use summary block? We can check easier cox_co 1 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!) Link to comment
cox_co Posted February 19 Author Share Posted February 19 Sure - https://squid-goldfish-8phm.squarespace.com/artists pw is pdai2024 scroll down past the flip card tests and you will see the summary block with two people visible. Link to comment
Solution tuanphan Posted February 21 Solution Share Posted February 21 You can use this to Website > Website Tools > Custom CSS /* Summary title */ a.summary-title-link { font-size: 38px !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!) Link to comment
cox_co Posted March 6 Author Share Posted March 6 Thank you @tuanphan!! That is a huge help. Based on your code snippet I also added font type, capitalisation and even adjusted the weight of the 'Read More' too. 🙏 tuanphan 1 Link to comment
fi1 Posted April 3 Share Posted April 3 (edited) Hi, just to add to this... the code shared above works well for font size changes, but I'm struggling to change the font itself on my site. I've tried: /* Summary title */ a.summary-title-link { font-family: Neue Haas Grotesk Text; font-size: 20px !important; } And I've also tried: .summary-title-link { font-family: Neue Haas Grotesk Text; font-size: 20px; } Here's a link to a page where the summary block is present too: https://writefulcopy.com/blog/get-content-published-or-perfect Grateful for any pointers on what needs tweaking here so the font actually changes. Cheers. Edited April 3 by fi1 Adding information. Link to comment
tuanphan Posted April 5 Share Posted April 5 On 4/3/2024 at 2:19 PM, fi1 said: Hi, just to add to this... the code shared above works well for font size changes, but I'm struggling to change the font itself on my site. I've tried: /* Summary title */ a.summary-title-link { font-family: Neue Haas Grotesk Text; font-size: 20px !important; } And I've also tried: .summary-title-link { font-family: Neue Haas Grotesk Text; font-size: 20px; } Here's a link to a page where the summary block is present too: https://writefulcopy.com/blog/get-content-published-or-perfect Grateful for any pointers on what needs tweaking here so the font actually changes. Cheers. Your id is correct but font name is incorrect a.summary-title-link { font-family: 'neue-haas-grotesk-text' !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!) 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