- AuthorPosts
- August 18, 2018 at 9:30 am #22150Anonymous UserMember
I am using pavilion. The mobile menu is not clickable. The menu was working when I initially launched the site. I had several others run through the site on laptop, mobile and tablet and test all links to be sure it was functioning before the launch. The link stopped working at some point and I started getting client complaints. Please help!
August 21, 2018 at 10:10 am #22151BoldGrid SupportKeymasterHello!
Thanks for posting your question regarding the functionality of the menu on mobile devices. I’m sorry to see that you are experiencing this issue. I have loaded the Pavilion theme with the latest version of BoldGrid plugins and was unable to replicate the issue. Can you please share the version of any/all BoldGrid plugins you are using, along with the version of WordPress you are seeing this issue on? As well, if you could provide a list of the plugins you are running in tandem with BoldGrid, this can help us to better assess the situation and determine if a resolution can be relayed to you.
July 24, 2020 at 10:44 am #25353VahhabGuestI have the same issue. I can navigate to the mobile burger menu and enter via “Space” but it’s not clickable either on the computer or touch devices.
July 24, 2020 at 11:22 am #25360Jesse OwensKeymasterHello Vahhab-
The most common cause of this issue with Pavillion is the widget area being empty, and therefore displaying “on top” of the hamburger-style mobile menu. To resolve this, you can use custom CSS by navigating to Customize > Advanced > Custom JS & CSS and pasting the following code into the Custom Theme CSS box:
#site-navigation { z-index: 99 !important; }
July 24, 2020 at 11:31 am #25361VahhabGuestHi Jesse,
Thank you for the advice.
I resolve the issue by the following method:
remove all the CSS customizations that I had in the “Custom JS & CSS”, which made my menu to place our of the click margin
use the following CSS instead to adjust the first block margines appropriately:@media (max-width:768px) { .main {margin-top:-7px;} } @media (min-width:768px) and (max-width:992px) { .main {margin-top:-95px;} } @media (min-width:992px) { .main {margin-top:-55px;} }
I hope this would be helpful for every one and thank you again for your support.
I will keep your advice if anything else goes wrong in the future.
Best,
Vahhab
- This reply was modified 4 years, 5 months ago by Jesse Owens.
- This reply was modified 4 years, 5 months ago by Jesse Owens. Reason: Add preformatted tag to code
July 24, 2020 at 11:32 am #25363Jesse OwensKeymasterAwesome, thank you for sharing Vahhab!
- AuthorPosts
- The topic ‘Mobile Menu Not Working’ is closed to new replies.