How to Fix Inconsistent Background Color on Shopify Pages?"

Store Design

Topic summary

A Shopify store owner is experiencing inconsistent background colors across their site, specifically on policy pages like the Privacy Policy page, which displays a light grey background instead of the desired white (#FFFFFF) that appears on other pages.

Issue Details:

  • Main site uses white background with black text
  • Policy pages (using default Shopify layouts) show different background shade
  • Store URL: outflairz.store

Solution Provided:
A custom CSS fix was offered that targets the specific page:

  1. Navigate to: Shopify Admin → Online Store → Theme → Edit code
  2. Locate the theme.liquid file
  3. Insert custom CSS code above the </head> tag that uses conditional logic to apply white background and black text specifically to the Privacy Policy page URL

The solution uses Shopify’s Liquid templating to check the canonical URL and apply styling overrides with !important flags to ensure the changes take effect. The issue remains open pending confirmation from the store owner whether the fix resolved the problem.

Summarized with AI on November 2. AI used: claude-sonnet-4-5-20250929.
1

How can I fix the issue where the body background color on some pages of my Shopify store (e.g., Privacy Policy page) is different from the rest of the website? I’d like to make it consistent with my site’s design

image.png
image.png1366×768 36.1 KB

2

Hi @faizkhanzade

Please provide the URLs of the pages you want to edit so I can assist you more effectively.

For default pages like policies, they usually come with standard layouts. If any adjustments are needed, you’ll have to manually edit them.

Let me know the specific changes you’d like, such as:

  • Background color: What color would you prefer?
  • Text color: Do you have a specific color in mind?

Please provide these details clearly, and I’ll guide you through the customization process!

Best,

Daisy

3

Hi @Daisy_12 ,

Thank you for your response!

The background color of my website is already set to white, and the text color is black, which is what I want. However, on some pages like the Privacy Policy page, the background appears in a different shade (light grey) instead of white.

Here’s the URL of the Privacy Policy page: https://outflairz.store/policies/privacy-policy.

I’d like to make the background completely white (#FFFFFF) to match the rest of the website. Could you guide me on how to achieve this?

Thanks,
Faiz Khan

4

Hi @faizkhanzade

In order to fulfill your request, please follow these steps
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code
Step 2: Search file theme.liquid
Step 3: Insert this code above 

{% style %}
      {% if canonical_url == "https://outflairz.store/policies/privacy-policy" %}
          main#MainContent {
              background: white !important;
          }
          main#MainContent * {
              color: black !important;
          }
      {% endif %}}
    {% endstyle %}

I hope this helps

Best,

Daisy