How to match collection page background color with homepage?

Store Design

Topic summary

A user seeks to apply the same background color from their homepage to their collection pages on their Shopify store.

Proposed Solutions:

  • Theme Customizer Method: Navigate to Sales Channels > Online Store > Themes > Customize > Theme Settings > Colors > Background 1, then enter the desired hex color. Some themes automatically apply this change across both homepage and collection pages.

  • Custom CSS Code: Add custom CSS code to the theme.liquid file (Online Store > Themes > Edit Code) at the bottom of the file to manually set the background color for collection pages.

  • Direct Theme Settings: Change the background color through the theme’s built-in color settings, similar to how the homepage color was modified.

The user confirmed interest in learning more complex customization techniques. The discussion remains open with offers for additional assistance.

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

Hi Guys! :handshake: :+1: Please help me with a easy task, I wanna put the same background color on collections pages like on homepage..

store link: www.aiciavem.ro

2

Are you running into trouble when editing your online store’s theme?

I was able to change my background color to red (from white) by going to Sales Channels>Online Store>Themes>Customize (on the live theme)>Theme Settings Widget (Top Left Corner)>Colors>Scroll down to “Background 1”>Enter the hex color you’d like. When I changed the color on my homepage, it automatically changed it on the collections page. If that doesn’t work for you (it could be a theme setting difference), choose “collections” in the top center of the page and then change the background color there. Be sure to save your work! If you don’t have these options, you may be running up against a theme issue.

3

Hi @sao ,

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.liquid

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

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

4

Hi Sao,

Just like you change the background color of your home page, similarly you can change the bg color of collection pages by copying the color code.

bg color.png
bg color.png1311Ă—629 159 KB

Save changes.

5

Can you please help me also with more complex things?

6

Yes Of course,

7

The solution I gave you earlier was helpful for you?