Mobile Main Menu Navigation Not Showing Up

Solved

Mobile Main Menu Navigation Not Showing Up

GenesisJunior
Visitor
2 0 1

The Main Menu which contains: Shop By Category, Shop By Brand, etc. shows up on the desktop version of our site, but not on the mobile version. 

www.garysonline.com

 

Accepted Solutions (2)

KetanKumar
Shopify Partner
37133 3648 12061

This is an accepted solution.

Hello, @GenesisJunior 

Welcome to the Shopify community!
and Thanks for your Good question.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.navigation-toggle-open {
background: #000;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

KetanKumar
Shopify Partner
37133 3648 12061

This is an accepted solution.

@Rich2727 

Thanks for post.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

Desktop 

.site-nav--has-dropdown:hover .site-nav__dropdown {
    display: block;
}
.site-nav__dropdown {
top: 20px;
}

 Mobile issue 

can you please check theme.js file issue so please download press theme and open free theme editor then theme.js file copy and past your current theme

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

Replies 32 (32)

oscprofessional
Shopify Partner
16116 2409 3125

Hello
Add this css in your css file. 
Online Store->Theme->Edit code->Assets->theme.scss.liquid

@media (max-width: 1079px){
span.navigation-toggle.navigation-toggle-close {
    display: block;
}
.navigation-toggle-close {
    left: -37px;
    right: initial;
}
}

 

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free

KetanKumar
Shopify Partner
37133 3648 12061

This is an accepted solution.

Hello, @GenesisJunior 

Welcome to the Shopify community!
and Thanks for your Good question.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.navigation-toggle-open {
background: #000;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
GenesisJunior
Visitor
2 0 1

That worked! Thank you so much

KetanKumar
Shopify Partner
37133 3648 12061

This is an accepted solution.

@Rich2727 

Thanks for post.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

Desktop 

.site-nav--has-dropdown:hover .site-nav__dropdown {
    display: block;
}
.site-nav__dropdown {
top: 20px;
}

 Mobile issue 

can you please check theme.js file issue so please download press theme and open free theme editor then theme.js file copy and past your current theme

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
NDS
Explorer
55 1 8

Hello @KetanKumar ,

 

I am having a similar issue with Prestige. The hamburger menu is not showing for the mobile view. Can you help me? 

 

https://newdaysports.com/pages/brandservices

PW: CoschStudio

 

Thanks in advance!

KetanKumar
Shopify Partner
37133 3648 12061

@NDS 

Thanks for post again

sorry i can't any issue give me screenshot so i will check and let you know

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
NDS
Explorer
55 1 8

Hello @KetanKumar ,

 

On the mobile view the menu is not showing. It is supposed to have: Services, Partners and Become a Partner section.

 

Thanks!

NDS
Explorer
55 1 8

Hello @KetanKumar 

Did you get a chance to take a look? I really need some help here 🙂

Thanks!

Ally_Paris
Tourist
9 0 0

Hello @KetanKumar 

Sorry to tag you but I have the same issue on my website 
My menu is not showing while clicking on it on mobile 

Do you think you can help ?

Password is twidah

 

Thanks in avance !

 

NDS
Explorer
55 1 8

@Ally_Paris ,

 

Could you fix it?

Ianc929
Excursionist
17 1 5

Hi Richard, 

I'm having the same problem, however, this solution doesn't work for me. 

On mobile, the nav bar works from some locations but not others.

Please help!

CryptoDramz
Tourist
10 0 4

Nightmare isn't it Ian.

Had to shut our site down as its pointless only having access to the homepage, there isn't even an option to select any other pages as its only showing our logo that is in the top left. Is this the same as you?

 

Ryan

Ianc929
Excursionist
17 1 5

Link to the website, help appreciated!

 

https://www.teslafrunksandtrunks.com.au/

Ianc929
Excursionist
17 1 5

I'm getting access from other pages like the shopping cart and login page but not product or home 

CryptoDramz
Tourist
10 0 4

This is the first time i've written on these community forums mate, whats the chances we get a solution to this?

 

Ryan

Ianc929
Excursionist
17 1 5

Ha...who knows, here's to hoping!

CryptoDramz
Tourist
10 0 4

Hi Ketan, Hope you are well.

I launched my shopify store today and my menu along the top isn't showing up when accessed through mobile! I tried inputting the code you've suggested before but its not helping. 

Please help us as we have been forced to take the website offline again sadly.

I Look forward to hearing from you.

Ryan

KetanKumar
Shopify Partner
37133 3648 12061

@CryptoDramz 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
CryptoDramz
Tourist
10 0 4

Hi Ketan, 

The URL is www.cryptodramz.co.uk 

I really appreciate your help with this. 

Ryan

Ianc929
Excursionist
17 1 5

Hi Ketan, 

If you also have some time to look at mine I would be very grateful. 

www.teslafranksandtrunks.com.au

Thanks 

Ian 

 

 

 

 

KetanKumar
Shopify Partner
37133 3648 12061

@Ianc929 

you have add wrong javascript file issue can you please revert your last change in theme.js file that's it 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Ianc929
Excursionist
17 1 5

@KetanKumar 

Thanks for your help, I removed the only two lines of code I put in theme.js and its still not working? 

 

Would you be able to tell me what the changes I need to make are? 

Thanks 

Ian 

KetanKumar
Shopify Partner
37133 3648 12061

@Ianc929 

sorry we're not able to store 

KetanKumar_0-1627963060419.png

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Ianc929
Excursionist
17 1 5
Ianc929
Excursionist
17 1 5

Https://www.teslafrunksandtrunks.com.au

Teslafrunks.myshopify.com

@KetanKumar 

Please try now 

KetanKumar
Shopify Partner
37133 3648 12061

@Ianc929 

thanks but i can't one error

KetanKumar_0-1627964972215.png

 

can you please download fresh debut fresh theme and and compare file code

https://www.diffchecker.com/

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Ianc929
Excursionist
17 1 5

Hi @KetanKumar 

Thanks for the suggestion. The two files are however the same. 

Ianc929_0-1627983126798.png

The search icon on the home menu is also not working 

Any additional suggestions would be greatly appreciated

Thanks 

KetanKumar
Shopify Partner
37133 3648 12061

@Ianc929 

thanks for update can you please download fresh theme and check same issue on new theme?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
KetanKumar
Shopify Partner
37133 3648 12061

@CryptoDramz 

i have check your mobile menu its perfect work

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Lisa121
Tourist
6 0 2

@KetanKumar 

Would you mind checking out my problem on mobile?

Things were jumping around on mobile, so I added this:

@media (max-width: 580px){
body, html{
overflow-x: hidden;
}
}

Now the nav is too wide/hidden.

I would be so appreciative of any help!!!

shop.fearlesshomeschoolers.com

Ianc929
Excursionist
17 1 5

I'm having the same problem, however, this solution doesn't work for me. 

On mobile, the nav bar works from some locations but not others.

https://www.teslafrunksandtrunks.com.au/

Please help!

O-E-W
Visitor
3 0 0

@KetanKumar 

I am also having the same issue with my mobile site.  I have tried all the options that have been posted here for the code and none of them have worked.  

outdoorequipmentwarehouse.ca 


Can you help me please?

 

Thanks

Thomas O'Connor