Put the menu in the header - UBER

Support
#1

I’m trying to replace the menu I have in a header I built in pro. For some reason I can’t get UBER menu to replace it. The options as to where it should go are limited to primary, default and footer. How can this be done

https://cl.ly/b4450482cb15/Image%202019-09-03%20at%2011.02.18%20AM.png

#2

Hi James,

The primary location that you talked about is for the standard header and not Pro header builder. As the Pro Header Builder use elements to retrieve the information there is o way that you can use the standard WordPress Menu locations.

As this is a unique situation that you want to embed the Uber Menu inside the Pro Header Builder it will need extra work to achieve the feature. Here are the steps that you should take:

  • Please go to Appearance > Sidebars and add a new sidebar. This will create a whole new Widget Area that you can add widgets to it later. Here is the documentation on how to do that.
  • Please go to Appearance > Widgets and drag the UberMenu widget into the Widget Area that you created in the step before. Here is the documentation on the UbderMenu Widget.
  • Please go to Pro > Headers and select the header in question and add the Widget Area element into the place that you want to have the UberMenu. Click here for more information about the Widget Area element.
  • Select the Widget Area that you have created in the first step and you will be able to see the Uber Menu.

Thank you.

#3

Well, some progress and then another obstacle

#4

Hello James,

To resolve your issue, please edit your header and then change the z-index of your bar to at least 9999 and then turn off the Content Scrolling option.

Please check out my sample header which was a duplicate of your current header.

#5

Thanks Rue. I tried several numbers in the Z index to see and things still worked with only 10. I don’t understand this aspect. Also, if you noticed, the font display in the top level items is odd - as though there’s a drop shadow but I can’t find anywhere in the UBER settings to turn it off.

#6

Hello James,

With z-index, the greater the number, it will make the element stay on top of other elements. In your bar, 10 works because the other bar may only have a z-index of less than 10.

By the way, the text shadow is coming from a default setting of the widget area. That is because of this css:

.widget {
    text-shadow: 0 -1px 0 rgba(0,0,0,0.95);
}

So to resolve your text shadow issue, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.x-bar-widget-area .widget {
    text-shadow: none;
}

Hope this helps.

#7

Okay thanks Rue. I’m not sure why a shadow would be a default and why it doesn’t show in the inspector.

WTF?

:roll_eyes:

#8

Hello James,

The text shadow is a default style setting for all the widgets in the Integrity stack which can be seen here: http://demo.theme.co/integrity-1/pages/sidebar-right/. It was applied to your menu since you’re Ubermenu is using the ubermenu widget inside the widget area element.

Hope this briefly explains it.

#9

I see. I forget I’m actually working with a stack but still it seems one would see the setting in the inspector. Did I miss that?

#10

Hi James,

Each stack could have its default styling which separates them from other stacks and some of it as no applicable setting in admin. It can be overriden through CSS, the CSS is also visible from the inspector. Though, if you’re on IE browser then yes, it would be hard to track it.

Thanks!

#11

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.