Sticky/Fixed Header and Navigation for Brooklyn Theme

Highlighted
New Member
4 0 0

Hello! I am seeing topics on this subject for all themes except Brooklyn, is it possible to do?

I want, as the customer scrolls down, that she/he does not "lose" the header and its options from sight.

 

Thank you!

0 Likes
Trailblazer
548 134 175

Hi, @maria_ana ,

This is Evita from On The Map.

 

Did you check out this post? https://community.shopify.com/c/Shopify-Design/BROOKLYN-THEME-Sticky-header-with-Logo/td-p/449684

 

Best,
Evita

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
0 Likes
Trailblazer
548 134 175

If that post didn't help you, then can you add your store URL, so I could see you header class names?

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
0 Likes
New Member
4 0 0

Hi!

I did, and tried it, but it has no background color, so it basically disappears when we scroll :(

0 Likes
New Member
4 0 0
Trailblazer
548 134 175

You can add the background color to the header?

 

Changing the header color, while you are scrolling, is really hard for beginner coder to do, so I think better option for you would be adding just the background color and maybe small border at the bottom of the header, so the header would be seen,

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
0 Likes
Trailblazer
548 134 175

Can you add your store password?

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
1 Like
New Member
4 0 0

sure,

 

aokleu

0 Likes
Trailblazer
548 134 175

Add this code

 

.header-wrapper {
    background: #1c1d1d;
    border-bottom: 1px solid #fff;
max-height: 11rem; }

You can change the background color or border width and color to whatever color you want.

 

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
1 Like