Change Color of Blog Page, Blog Posts, and Policies Pages

Store Design
, , ,
1

Hi! For my blogs, including the blog posts themselves, and policies, like the privacy policy, etc., I can’t seem to edit the background color and color of the texts.

HangoverHelper_0-1715839542503.png
HangoverHelper_0-1715839542503.png1875×862 196 KB

HangoverHelper_1-1715839567969.png
HangoverHelper_1-1715839567969.png1863×853 85.8 KB

Is it possible to change the background to #070909 and texts to #FFFFFF and main heading/title to #F29D52?

Thank you so much in advance! Currently trying to figure it out as well.

tryhangoverhelper.com

https://51d86a-2.myshopify.com/

Password: steiyi

2

@HangoverHelper

The blog will be looks like this after adding your css code to the site. is that ok so that i will share the code?

2024-05-16 11_21_36-Adobe Dreamweaver CS6.png
2024-05-16 11_21_36-Adobe Dreamweaver CS6.png1216×617 252 KB

Thanks

3

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Add the code below to the base.css file

.main-blog h1,
.blog-articles .card__information .h2 {
    color: #F29D52 !important;
}
#shopify-section-template--22716421833017__main {
    background-color: #070909 !important;
    color: #fff !important;
}

After modification:

AnneLuo_1-1715840632379.png
AnneLuo_1-1715840632379.png1313×724 165 KB

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

1 Like
4

Hi @HangoverHelper ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file base.css or theme.css

Step 3: Insert the below code at the bottom of the file → Save

.card__information {
    color: #ffff !important;
 }

.card__information .h2 a {
    color: #F29D52 !important;
 }

.card__information time {
     color: #ffff !important;
 }

 main#MainContent {
    background-color: #070909 !important;
 }

 h1.title--primary.scroll-trigger.animate--fade-in {
    color: #F29D52 !important;
}

Here is result:

BSSTechVenture_3-1715841372363.png
BSSTechVenture_3-1715841372363.png1918×914 215 KB

Hope this can help you

1 Like
5

Hi! Thanks! It worked. If this is also possible with the blog posts and policies (found in footer) that would be much appreciated! :slight_smile:

6

Hi! Thank you! It worked. If this is also possible with the blog posts and policies (found in footer) that would be much appreciated! :slightly_smiling_face:

7

Okay. Just add the code to the base.css file

#MainContent{
  background-color: #070909 !important;
}
.shopify-policy__container {
    color: #fff !important;
}
.shopify-policy__title h1,
.shopify-policy__body h2, 
.shopify-policy__body h3 {
    color: #F29D52 !important;
}

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

8

Hi @HangoverHelper , Pls insert this code to your file css :

.footer-block__heading.inline-richtext {
    color: #f29d52 !important;
}

Hope this can help you