I wonder what might be the reason for ubermenu icon not showing up in “off screen element” for mobile devices.
for pc and larger screens all’s roger. as soon as it hits the mobile breakpoint:
I’m talking about the “lock” icon in the left upper corner… and I beg for apology not being allowed to reveal the URL for public
Hi Ondrej,
Thanks for reaching out.
I have checked your website and found that the Header Bar containing the Lock icon is set to hidden for the Smaller Screen by using the Hide During the Breakpoint option. I would suggest you make that visible or you can create another bar that is visible in the specific screen size and add the same element into that.
Hope it helps.
Thanks
Ahhh sorry, but as I understand: it’s an issue of “area off canvas element”. the icon is a part/feature of ubermenu.
the bar with the area off canvas element is visible on mobile devices or under 797px and is hidden above.
the “box” model of the bar that shall display the ubermenu properly at/under 797px:
bar -> container -> content area off canvas -> global block
global block structure: section -> row -> column ->menu
The issue is the ubermenu does not display the icon even the containing bar is at the breakpoint visible.
The bar you suggest to unhide may not be visible at/under 797px.
So I did exactly what you suggested as second. I placed/copied the menu with the lock in a bar which is visible at/under 797px.
Yet the lock icon is not visible but the text - even the setting is the opposite.
Maybe this detail might help as well: The structure of the menu visible above 797px is a little different.
bar-> container -> widget area.
pls check on mobile.
Hello Ondrej,
Did you add the Ubermenu in one of the Global Block which you also have inserted in a Bar element? You will have to check the visibility of the Bar element in specific screens size because it may have been hidden away on smaller screens hence, the Ubermenu will also not be displayed. To better assist you with this issue, please provide us access to your site so we can check both the header and your global block. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
- Confirmation that we can access and make changes to your site
To know how to create a secure note, please check this out: How The Forum Works
Best Regards.
here you go. all setup and running. Thank you very much for your effort.
Hello Ondrej,
In your Ubermenu settings, only the primary menu is integrated. into the theme.
This means that the menus that you have inserted on the header is an ordinary menu. It is not an Ubermenu. This is why the Ubermenu icon is not displaying. You should assign Primary Menu first and then use this menu in your custom header so that the Ubermenu will also be integrated in your custom header.
To properly use the Ubermenu in your custom header, please check out this video tutorial:
Best Regards.
Ok. What if I have more than one menu where an icon is needed? In my custom header there are 4 menus actually. the off screen menu would be the fifth?
EDIT: Well I’m afraid, your suggestion is not the issue. I defined the menu in question as primary menu in ubermenu. But in the “mobile” menu (global block in a content area off canvas) I added the menu as a “navigation collapsed” element. And here the icon is still missing. If I add here the menu the same way as I did for the bar over 797px in a widget area then the icon displays properly… there is something rotten in the state of denmark…
EDIT2: the submenus in the mobile navigation need a different behaviour than the menus over 797px breakpoint… I guess I have some design logic issue here… with the current logic all were fine but the bl… icon.
EDIT3: ok the design of the menu with the lock is conditional. That means a logged in user has a different menu than a guest. This functionality is controlled by a plugin “ultimate member”. The menu design is still based on the ubermenu setup.
So, I design my menus in the backend over “design -> menus”. It looks like some ubermenu integration into the PRO theme thing: If I insert the menu over a widget the ubermenu functionality (icons and all the fancy stuff) all’s roger. If I use the “navigation” element of any kind, the ubermenu is ignored regardless of primary menu being definde or not and just the regular menu is included. The “ultimate member” functionality is preserved though.
My conclusion is: the “navigation element” of any kind ignores ubermenu. Now I just need to prove my hypothesis.
EDIT4: ok I figured it out, I guess. Navigation element does not support ubermenu. But it’s not a bug but a feature. Navigation element and ubermenu is like apple and oranges. Two different things that can’t be combined because of way different logic and functionality. Am I right? So if I want to have an Icon, I need to set this in for the navigation element itself.
EDIT5: Question: Why is it not possible to change the icon in cornerstone for the navigation element top links but it has to be defined in the “wordpress backend -> design -> menu”?
This makes my endeavor very complicated. I guess I pass on the icon in the mobile menu.
Hello Ondrej,
The Ubermenu will only work together with the primary menu when using the default header. Since you have built a custom header, you need to follow the video on how you can incorporate the Ubermenu with the Header Builder. This means that you are going to:
1.) Create a custom sidebar in Appearance > Sidebars
2.) Then go to Appearance > Widgets and and insert the Ubermenu Navigation and insert it to the newly created sidebar
3.) In your header builder, you will have to insert a Widget Area element and then select the newly created sidebar where you have inserted the Ubermenu.
The Navigation Inline element is only good for desktop screens. You should be using a combination of the Navigation Inline and the Navigation Collapse or Navigation Off-canvas so that you will also have a mobile menu.
Take this sample custom header in the secure note below. You can show/hide the Navigation element on specific screen size by utilizing the “Hide During Breakpoints” option in each element settings.
Hope this helps.
thank you for your effort. But this is not really what I need nor what I want. As long as I can figure out the “magic” behind… I’m fine. I’m also fine with the widget solution, but as said a “misuse” of a tool works so long until it does not.
but again if it would be possible to change the icon in any navigation element, that would be a charm. I mean not in the “design -> menu” workflow… but directly in cornerstone.
Hey Ondrej,
That would only be possible if you build your menu manually in Cornerstone. I’m don’t mean any navigation element though. You need to create each menu item using:
<a> HTML Tag to turn the Div into a link
If you really need to use the WordPress Menu system though, regretfully, there isn’t a solution but to find a 3rd party menu plugin.
Hope that helps.
Thank you very much for the info. Well my menus are conditional based on user role as well… so it’s too “tricky” and some fancy stuff is not really a biggie… a cherry on top, but that’s it.
You’re welcome, Ondrej. And, thank you for your feedback.
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.