Making Dropdown Menu of Debut-theme fixed for Mobile Pages

Highlighted
New Member
3 0 0

Hi there,

 

I guess my question is simple, but I can't work this out using standard setting. So the header menu in Debut theme is a drop down. See attachment. 

 

However, I would like my mobile visitors (which are the most!) to see all menu items without them having to click on the menu to see all items. Any help here would be hot!

HeaderHeader

 

Drop downDrop down

 

 

0 Likes
Highlighted
Shopify Partner
539 76 109

Please provide website URL and if your store is password protected then please provide password

If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Highlighted
New Member
3 0 0

Of course.

 

www.kratosz.com

Password: kratosz

0 Likes
Highlighted
Tourist
13 0 0

Hi, @Excursionist how do I change the dropdown menu in my debut theme to look like the dropdown menu in the Brooklyn theme?  I like how it looks for my website.

This is how I want it took. This is the brooklyn theme.This is how I want it took. This is the brooklyn theme.here is the debut theme. I dont like the white background and how the sub menu is largerhere is the debut theme. I dont like the white background and how the sub menu is larger

0 Likes
Highlighted
Shopify Partner
539 76 109

@Thimo It is decent view of responsive header menu. You say where will you put menus in mobile view? And then It will look decent? 

If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Highlighted
Shopify Partner
539 76 109

@kokoshana Please provide website url and if your store is password protected then also provide password

If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Tourist
13 0 0

@paramSoft 

everythingcutesy.myshopify.com

password: ETC10

0 Likes
Highlighted
Shopify Partner
539 76 109

Place this code at the end of theme.scss

.site-nav__dropdown {
border: none !important;
}
.site-nav__childlist {
    background: transparent;
}
.site-nav__childlist-grid {
diplay: block !important;
}
If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
1 Like
Highlighted
Tourist
13 0 0

@paramSoft Thank you very much!!! it works on the desktop version but the  mobile version is not the same. How can I fix this problem please?the text is  at the bottom of the image and it supposed to be in in front of the text. Also, the menu is hidden behind the image on top.the text is at the bottom of the image and it supposed to be in in front of the text. Also, the menu is hidden behind the image on top.I'd like for the mobile version to look like this.I'd like for the mobile version to look like this.

0 Likes
Highlighted
Shopify Partner
539 76 109
.mobile-nav-wrapper {
z-index: 1;
}
If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
1 Like