Hi y’all I have a question about our header. The header turns from transparent to white while scroling as it should be, however on a mobile device it doesnt turn white at all - it stays transparent (but on the mobile preview on the desktop it shows is as it should be). Can someone help me? the sh…

It’s because this style is not supported on mobile devices. [AnneLuo_0-1710578663443.png] You can modify the background color on the mobile device separately. You can try this code by following these steps: Step 1: Go to Online Store->Theme->Customize. Step 2: Find the header section on the ho…

@Bodyguard55 Please follow below steps to remove the white background on the header. Let me know whether it is helpful for you. From admin, go to “Online Store” → “Themes”. Click “Customize” button from the current theme. Click header section and paste below code in the “Custom CSS” field. @media…

[Bodyguard55_0-1710956693347.png] I can’t upload it, there seems to be an error in the following part: .section-header.shopify-section-group-header-group.scrolled-past-header sticky-header.header-wrapper { background: #FFFFFF !important; }

@Bodyguard55 It shows because the element we have used is not found before scrolling the page in customize mode. The element will be available only after scrolling the page. But, you can able to save the code and view the changes in store frontend. Please save the code and let me know if you are sti…

I can’t save the code it doesnt allow me…

Header on mobile transparent while scrolling, but shouldn't.

Store Design

Bodyguard55 March 18, 2024, 9:04am 3

Hi AnneLuo

Thanks for your response.

However thisone doesnt work for us bc the header on the mobile device is now completely grey and not semi transparent like yours…

Topic		Replies	Views
Transparent Header on theme Store Design design , customizations	9	113	August 21, 2025
Bug on mobile version for transparent header that turns white upon scrolling in Dawn Theme Store Design header , css	5	61	September 7, 2023
How to create transparent header Store Design header	8	73	September 11, 2024
Mobile Header transparent (only on home page) , when scrolled it should be white Store Design menu , design , header , customizations , landing-page , css , third-party-themes , shopify-themes , troubleshooting , html	2	25	October 29, 2024
Header is transparent in when I am on desktop but is white on mobile Store Design header	3	42	October 1, 2023

Header on mobile transparent while scrolling, but shouldn't.

Related topics