Re: How do i change the colour of my blog post page

How do i change the colour of my blog post page

dumbl3d00r
Excursionist
19 0 3

hi i want to change the colour of my blog post page from white to #7e6d60 and to make the text and title colour #2f261e instead of black

Screenshot (118).png

Replies 4 (4)

Moeed
Shopify Partner
5945 1612 1926

Hey @dumbl3d00r 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
article.article-template {
    background: #7e6d60 !important;
    color: #2f261e !important;
}
</style>

RESULT:

Moeed_0-1727369861774.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Get a quick Shopify quote – Click here!

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications


BSSCommerce-B2B
Shopify Partner
1967 564 566

HI @dumbl3d00r , 

I have reviewed your requirement, you just need to edit css script and the issue will be resolved.  You can follow my instructions! 

 

Step 1: Go to Admin -> Online store -> Theme > Edit code:

BSSCommerceB2B_0-1727369840533.png

 

Step 2: Search for the file theme.liquid. And add this code snippet before tag </head> or </body>: 

 

 

<script>
    document.addEventListener("DOMContentLoaded", function() {
             if (window.location.pathname.includes("blogs")) {
                  var style = document.createElement('style');
    style.innerHTML = `
    main#MainContent {
        background: #7e6d60 !important;
        }
    h1.article-template__title {
        color: #2f261e !important;
        }
    `;
    document.head.appendChild(style);
             }
          });
</script>

 

I'm using JS script to append only on blogs page.

Step 3: Save and reload page:

The result will be: 

BSSCommerceB2B_2-1727370049067.png

 

I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.

Have a nice day sir! 

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

dumbl3d00r
Excursionist
19 0 3

Screenshot (120).pngAlso how do i change that white part to the same colour #2f261e or remove it and change the comments button to that same colour at the bottom of the blog 

Screenshot (119).png

BSSCommerce-B2B
Shopify Partner
1967 564 566

@dumbl3d00r ,

Step 1: Go to Admin -> Online store -> Theme > Edit code

Step 2: Search for the theme.liquid

Step 3: Add this code before </body>

<style>
 .article-template {
   background: #7e6d60!important; 
 }
 article.article-template * {
    color: #2f261e!important;
 }
</style>

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now