Shopify themes, liquid, logos, and UX
Hello,
I want to the Navigation bar fixed, which allows my products categories(navigation bar) be fixed on page, when scrolling down from the PC monitor and the mobile.
Shopify Theme: Minimal Theme
The previous post did not solve this issue.
Pls assist.
Thank you!
Solved! Go to the solution
This is an accepted solution.
Hi Annieann,
Here's a simple guide to adding a fixed header to your store!
Open your stores dashboard --> Online Store --> Actions --> Edit Code --> Open 'theme.scss.liquid' -->
At the bottom of the file copy and paste this code and you should have your fixed header:
/* Fixed Header Solution */
#shopify-section-header {
position: fixed !important;
z-index: 100;
width: 100%;
top: 0;
}
.site-header {
background-color: white;
}
.main-content {
padding-top: 200px;
}
/* --------------------- */
Let me know if this works for you!
NOTE: If you edit any files on your store, I advise that you duplicate the theme before doing so and editing the duplicated theme instead. This will prevent your live site from breaking if something goes wrong.
This is an accepted solution.
Hi Annieann,
Here's a simple guide to adding a fixed header to your store!
Open your stores dashboard --> Online Store --> Actions --> Edit Code --> Open 'theme.scss.liquid' -->
At the bottom of the file copy and paste this code and you should have your fixed header:
/* Fixed Header Solution */
#shopify-section-header {
position: fixed !important;
z-index: 100;
width: 100%;
top: 0;
}
.site-header {
background-color: white;
}
.main-content {
padding-top: 200px;
}
/* --------------------- */
Let me know if this works for you!
NOTE: If you edit any files on your store, I advise that you duplicate the theme before doing so and editing the duplicated theme instead. This will prevent your live site from breaking if something goes wrong.
hey, @Annieann
Welcome to shopify store.
please share your website URL links and password.
thank you so much.
Hello @DMT-Mike ,
Thank you very much. It's working perfectly now.
This is a very good solution and I highly recommend it.
Good Day! Happy Turkey Day!
Hello @khilan,
Thank you for your reply. The problem has been solved.
I wish you a Happy Thanksgiving in advance.
Hi @DMT-Mike ,
The navigation bar is fixed and working fine, but now there's another problem. That is part of the top of the banner is blocked, could you help me to solve this problem again? Thank you very much!
No Problem!
Would it be possible to get a link to the site so I can see the issue? Or maybe a screenshot?
Thanks
Hi @DMT-Mike
It's a great honor to have your help. I will provide you with a link to the page。
https://homeallin.com/pages/terms-and-conditions
You can see the title was blocked by the navigation bar.
I'm looking forward to your reply. Thanks!
User | RANK |
---|---|
214 | |
145 | |
66 | |
46 | |
45 |
Thanks to all Community members that participated in our inaugural 2 week AMA on the new E...
By Jacqui Mar 10, 2023Upskill and stand out with the new Shopify Foundations Certification program
By SarahF_Shopify Mar 6, 2023One of the key components to running a successful online business is having clear and co...
By Ollie Mar 6, 2023