Header Pro Understanding Issue

Support
#1

Hello,

I’m having issues understanding Pro Header. In the secure note, there is a link on what I’m trying to accomplish.

  1. In the header left side, aligned to top, I would like social links.
  2. In the header center, I’d like the logo.
  3. In header right, aligned to top, I’d like a cart icon.
  4. In header bottom, I’ve placed a raw element, then my ubermenu short code for my menu in it. However, when viewing page it states “No Menu to display”. Though I’ve picked the “main” one.
  5. Each time I make a new “Bar” in Pro Header there is a bottom shadow effect added to each one when viewing the page. Anyway to remove this, please?

Would you mind taking a look at my Pro Header with these questions? Your expertise is very much needed! Thank you for your kindness in helping me!

#2

Following up for question #3… the menu bar has now populated and is showing. Though I need it to be full page width and not have white space above and below it. Thank you for looking into this!

#3

Hey @RocktheHouse1876,

The key to understanding Pro Header and Footer builder is to learn Flexbox first. The builder’s layout options will be familiar to you after that. I’d also recommend watching more tutorials available in our Knowledge Base and Youtube Channel.

-----------------------------------------------------------------------------------

For the header layout that you want, I see that you’re using 3 containers in your bar so that’s good. The first one contains your social links. The second one, the logo and the third one the cart icon.

The only mistake is you’ve set the 3rd container to Fill Space so it’s pushing other containers to the left because it wants to “fill the space”. You should set it to Standard. You’ll understand how this works if you’re going to learn Flexbox.

-----------------------------------------------------------------------------------

For your UberMenu problem, since you’re using the shortcode, you need to use the shortcode generator to give you the correct shortcode setup.

-----------------------------------------------------------------------------------

For the bar shadow, set all the values in the Box Shadow options to 0.

Hope that helps.

#4

Thank you, that makes sense and was able to get it!

I’m troubleshooting to get the social icons (top left) and the cart (top right) to be within the page width, not outside of it. Your expertise is needed on this one! Please help!

Please see screenshot in secure note of what trying to accomplish…

#5

Hi @RocktheHouse1876,

First, please navigate to Theme Options > Layout and Design and take note of your Site Width and Site Max Width value.



Then apply this same value to your Top Bar’s Content Length (in %) and Content Max Length (in px)

Note, keep the Outer Spacing value to 0

Hope it helps,
Cheers!

#6

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