Keep Website logo static when scrolling down webpage

Solved
DarmorGamz
Excursionist
23 0 5

Hi, I'd like to have my logo stay with the header while customers scroll. Im using the Context theme.

Store Url: NinjaToolSupply.com

Password: password

DarmorGamz_1-1618277571119.png

 

DarmorGamz_0-1618277597378.png

 

0 Likes

Hi @DarmorGamz ,

Please add a logo for the sticky Header too. Follow the steps:

1. Go to Customize

2. Header

3. Sticky header logo image

Showcase-2020 _  (2).png

Please let me know if you need any assistance.
Good Luck!

Zeian Shahzad | Designer | Developer
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Email: shopify.zeian@gmail.com
Cheers!!
0 Likes
DarmorGamz
Excursionist
23 0 5

DarmorGamz_0-1618286901739.png

Sticky logo makes it look like this

0 Likes

@DarmorGamz 

You need to make some code changes, please add me as a staff so I can fix it for you.

Zeian Shahzad | Designer | Developer
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Email: shopify.zeian@gmail.com
Cheers!!
0 Likes
LitExtension
Shopify Partner
953 112 165

Hi @DarmorGamz

Please place this code at the end of the "index.css" file to fixed the sticky header on your site.

@media (min-width: 60em) {

    .header-container.is-sticky .header__sticky-logo-wrapper {

        position: relative;

        justify-content: center;

    }

}

Hope this helps.

Screenshot to refer: https://prnt.sc/11c8rko

 

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes
DarmorGamz
Excursionist
23 0 5

DarmorGamz_0-1618386588523.png

How do I keep the header menu centered

 

0 Likes
LitExtension
Shopify Partner
953 112 165

This is an accepted solution.

 Hi @DarmorGamz

Please place this code at the end of the "index.css" file to center your menu when sticking your header:

@media (min-width: 60em) {

  .header--default .header__nav {

    display: block;

    margin: 0 auto;

  }

}

Hope this helps! 

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!