Activate transparent header on all pages | Palo Alto Theme

Store Design
, , ,

Topic summary

A user sought to enable the transparent header feature across all pages of their Shopify store using the Palo Alto theme, as it was only appearing on the homepage.

Solution provided:

  • Navigate to theme code editor via “Edit code”
  • Open the “theme.scss.liquid” file in the Assets folder
  • Add CSS code to make the header transparent:
.site-header {
  background-color: transparent;
}
  • Place this code at the bottom of the file or in a suitable location for custom CSS

Outcome: The solution successfully resolved the issue, with the user confirming it works across all pages.

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

Hi,

For our store moodstreet-shop.myshopify.com we activated the transparent header, but it is only showing transparent on the home page. Is there a way to place some CSS code that enables this for all pages?

Thank you in advance for reacting to this thread.

Cheers,

Teddy

2
  1. From the dropdown menu, select “Edit code”. This will open the theme code editor.
  2. In the left-hand sidebar, under the “Assets” folder, click on the “theme.scss.liquid” file to open it.
  3. Scroll to the bottom of the file or find a suitable place to add your custom CSS code.
  4. Add the following CSS code to make the header transparent:
.site-header {
  background-color: transparent;
}
​
1 Like
3

GREAT THANKS!!! IT WORKS!