Jump to content

Changing fonts and colors for only Blog text body entries

Recommended Posts

Site URL: https://bagpipe-swordfish-5feg.squarespace.com/blog

I would like to change the color and the font on each blog entry. Do I have to manually change the color and font for each entry or is there code that would change the blog color and font overall without changing the Paragraph 2 font and color across the whole site? I see under site design the option for title and pagination but not an option just for blog text body. Thanks.

https://bagpipe-swordfish-5feg.squarespace.com/

password: home

 

Link to comment
  • Replies 5
  • Created
  • Last Reply

Top Posters In This Topic

You mean change blog title, blog content, blog pagination or? Change Color, Font Name or?? and for Blog List Page or blog individual posts?

https://bagpipe-swordfish-5feg.squarespace.com/blog?noredirect

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
On 12/28/2021 at 7:22 AM, tuanphan said:

You mean change blog title, blog content, blog pagination or? Change Color, Font Name or?? and for Blog List Page or blog individual posts?

https://bagpipe-swordfish-5feg.squarespace.com/blog?noredirect

Sorry I wasn't more clear. Currently the blog content text color is white but I would like to have the blog content automatically switch to black for previous entries and any new individual posts if possible. I have one entry manually changed over to black but the rest are white. 

I would also like to change the font for blog content on individual posts.

 

Thank you

Link to comment
On 12/30/2021 at 10:44 AM, katierelease said:

Sorry I wasn't more clear. Currently the blog content text color is white but I would like to have the blog content automatically switch to black for previous entries and any new individual posts if possible. I have one entry manually changed over to black but the rest are white. 

I would also like to change the font for blog content on individual posts.

 

Thank you

#1. It looks like you changed to black?

image.thumb.png.ff36c7997ee0d011eb3d0fc5f28e5db9.png

With blog title, pagination, add this to Design > Custom CSS

/* blog title */
div.blog-item-title h1 {
    color: black !important;
}
/* blog pagination */
.item-pagination[data-collection-type^="blog"] .item-pagination-title {
    color: black !important;
}
/* blog content font */
.blog-item-content.e-content * {
    font-family: 'orpheus-pro' !important;
}

 

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
On 12/31/2021 at 9:58 PM, tuanphan said:

#1. It looks like you changed to black?

image.thumb.png.ff36c7997ee0d011eb3d0fc5f28e5db9.png

With blog title, pagination, add this to Design > Custom CSS

/* blog title */
div.blog-item-title h1 {
    color: black !important;
}
/* blog pagination */
.item-pagination[data-collection-type^="blog"] .item-pagination-title {
    color: black !important;
}
/* blog content font */
.blog-item-content.e-content * {
    font-family: 'orpheus-pro' !important;
}

 

Thanks Tuan. If I wanted just the paragraph 2 text in the body to turn to black automatically just on the blog (so I don't have manually fix everytime like I have previously) would it look something like below?

 

/* blog body */
div.blog-item-title p2 {
    color: black !important;
Link to comment
  • 2 weeks later...
On 1/3/2022 at 5:47 AM, katierelease said:

Thanks Tuan. If I wanted just the paragraph 2 text in the body to turn to black automatically just on the blog (so I don't have manually fix everytime like I have previously) would it look something like below?

 

/* blog body */
div.blog-item-title p2 {
    color: black !important;

p2, use this code

/* blog p2 */
.blog-item-content.e-content p:not(.sqsrte-large):not(.sqsrte-small) {
   color: black !important;
}

 

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

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.