How to fix a sticky header issue in Dawn theme?

Store Design
, ,
1

Hi all,

I have coded by header to be transparent which I want, but having the issue with the header (logo) following the scroll. This leaves the logo covering text/images & just looks unprofessional.

How can I get the header to not follow the scroll?

lmcpembroidery.com

You can see what I mean.

2

Hi @Lorcanmcp ,

This is David at SalesHunterThemes.

You can try to follow these steps:

Go to Online Store → Themes → Actions → Edit code.

Go Assets folder → base.css file.

Add this following code at the bottom of page.

.header-wrapper {
  position: absolute !important;
}

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

David | SalesHunterThemes team

3

Hi, @Lorcanmcp .

Follow These Steps.

Goto Online store > Assets > Edit code > find Base.css File and paste the code mentioned below.

.header-wrapper {
    position: absolute;
}

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

4

Perfect David that has worked.

Just a quick one on this also - the info in the product pages (images/titles) load behind the header. I want the photos/title to be below the header on the product page.

Can this be done?

Screenshot 2023-10-10 115013.png
Screenshot 2023-10-10 115013.png1446×766 114 KB

5

Hello @Lorcanmcp ,

I understand you are looking to resolve the sticky header issue.

As you are using the Dawn Shopify theme, please follow the below mentioned steps to remove the sticky effect on header.

  1. Go to Online Store, Themes and then click ‘Customize’.

  2. On the left side, click on Header section https://prnt.sc/rGVL2otzYWE6

  3. In the Header section, select ‘None’ in the Sticky Header option. https://prnt.sc/GLFzE40F9UyH

  4. Save changes https://prnt.sc/TM-R-1GiJnuh

Now the header will not follow the scroll.

I hope the solution helps you.

Kindly let me know if you have any query.

Thank you.