- This topic has 7 replies, 3 voices, and was last updated 4 years, 7 months ago by
Ying.
-
AuthorPosts
-
August 24, 2021 at 3:42 am #1906457
Konstantin
Hi! I’m trying to display different menus and other content on different sections of my site using Elements and Hooks. It’s working great when I use the available hooks and the custom_shortcode_hooks workaround for random areas of the site. However, I can’t seem to figure out how to display those menus in the Off Canvas Panel using Elements Hooks with Display Rules, since there are no such off canvas hooks. There are the generate_iside_mobile_… hooks, but those don’t seem to do the trick. I already know how to use the Off Canvas Widget area, but I can’t set Display Rules on there. Thanks in advance!
August 24, 2021 at 6:18 am #1906610David
StaffCustomer SupportHi there,
there are two hooks you can use:
generate_inside_slideout_navigation
generate_after_slideout_navigationThe Off Canvas used to be called Slideout 🙂
August 24, 2021 at 9:52 am #1907042Konstantin
Thank you, David! I am having some weird issue though. I have a menu assigned to the Off Canvas panel (the 3 items in all caps). The additional menu I display above does not show up on mobile. If I use my browser on desktop and resize to get the hamburger and click to get the Off Canvas panel, the additional menu still doesn’t show up, until I expand the browser. I’m not using any CSS to hide that menu, so I’m not sure what’s going on here.

August 24, 2021 at 11:24 am #1907135Ying
StaffCustomer SupportHi Konstantin,
Any chance you can link us to the site in question?
You can use the private information field.
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-informationLet me know 🙂
August 24, 2021 at 11:40 am #1907158Konstantin
Hi Ying. Login info provided in the field. Thank you!
August 24, 2021 at 1:02 pm #1907226Konstantin
I was able to figure it out. This is what was causing the issue:
@media (max-width: 768px) { .main-navigation ul, .main-navigation:not(.slideout-navigation):not(.toggled) .main-nav > ul, .gen-sidebar-nav, .has-inline-mobile-toggle #site-navigation .inside-navigation > *:not(.navigation-search):not(.main-nav) { display: none; } }The fix:
@media (max-width: 768px) { .main-navigation ul { display: block; } }August 24, 2021 at 1:19 pm #1907242Konstantin
Thank you!
August 24, 2021 at 1:25 pm #1907245Ying
StaffCustomer SupportNice! Glad you figured it out!
-
AuthorPosts
- You must be logged in to reply to this topic.