Change the complete background layers of the page to a specific color

Hello experts,

My site URL: zatura.in

I’m using the Dawn theme. The default colour of the dawn theme was white. I customized the Dawn theme to my brand colour (#f1efe7). However, I could see white color flicking out then and there while moving from one page to another. The white colour is showing for 1-2 secs during the page load time.

I could also see this white layer when between few sections. Please check the image below.

I know that we can play around with the section padding and css. But what is the permanent solution for the load time color? If I move from one page to another page, I want to show my brand color. Not the white color. Please help me with this.

I want to change the complete website layers to MY colour instead of white. Need your help on this.

Thank you!

For your second question, to get the site to load your color, you will need to place some CSS at the very top of your site before ANYTHING starts loading.

I would add this code to the very top of there theme.liquid file right after the opening tag.

Please make sure to backup your theme before editing any code!


as for your first question, I am not sure without really looking at your site and inspecting the containers.

Hey @Zatura

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 tag


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

Best Regards,
Moeed

Hi @Zatura

This is Richard from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the


Hope this can help you solve the issue

Best regards,

Richard | PageFly

Hi, @Zatura .

Follow These steps,

Go to the online store theme and go to base.css file paste the code mentiond below.

.gradient {
    background: #ff3131;
}

Result:

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