Allign page color with default page color

[HereNowOwner]

Hi all,

I'm having trouble making the background of specific pages on my webshop the same colour as my theme's background color for default pages & product pages. The page background color now shows as white which is different to the rest of the website and doesn't look nice. 

To give you an idea. Below image you see a screenshot of my FAQ page which has a white background. While the default colour of the dawn theme I picked is grey (footer colour). 

On the default page design I don't have this issue: 

I tried many ways of customizing the colour of my custom pages without the use of code but I haven't found any solution yet myself or via the community. 

Any solution to this? 

Store preview: https://px8sim7z89e98356-86932554052.shopifypreview.com

Thanks so much for the help!

[Dan-From-Ryviu]

You can change the color of your page from Online Store > Customize > Theme settings > Colors  > Schemes > click on Scheme 1, change Background option

[Huptech-Web · Accepted solution]

Hello! @HereNowOwner  Please follow these steps to add this CSS code:

1. Go to your Online Store
2. Click on "Themes"
3. Select "Edit code"
4. Open your CSS file. If you have a custom CSS file, open that instead.
5. If you can't find your custom CSS file, open "base.css"
6. Add the following code at the end of the file.

section#shopify-section-template--23662869086532__main {
    background: #f3f3f3 !important;
}

If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the solution.
Best regards
K.K

[HereNowOwner]

This worked perfectly!! thanks so much!

[HereNowOwner]

Hi @Huptech-Web 

I placed the code in base.css this morning and the solution worked perfectly. However, I've opened my webshop again this evening and the pages are back to the old color and no longer matching. The code is still in place.

Do you know what is causing this and/or how to fix this?

Thanks so much again!

[Huptech-Web]

Hi @HereNowOwner Please try this one following the same steps outlined above.

section, .shopify-section, .section {
    background: #f3f3f3 !important;
}

 
If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the solution.
Best regards
K.K

[HereNowOwner]

Hi, 

I've place the code and saved. Previewing the website on my current desktop still has the same issues. However, when I open the preview link on my mobile device and on another desktop device it all looks great. So I believe it's fixed, it might have to do with the cache of this PC not refreshing the update. 

Anyway, the problem is solved. Liked and marked as solution!

Thanks again!