Aligning logo with menu & drop down spacing issue

dreamonventures · September 2020

1. How do I align my menu so that it's on the same line & centered with the logo? I'm using Classic layout style:

2. How do I create more space between the menu items?

3. How do I eliminate the space between the top nav & sub menu dropdowns?

Pablo · September 2020

Hello,

1) That’s because of too many menu items inside the grid width of the website - to extend it, please go to the Theme Options > Global > General

https://prnt.sc/rsaxzf.
There is another way to remove that problem, decrease the font size of the main menu in Theme Options > Fonts > Size & Style
https://prnt.sc/rsaz4r
Otherwise, you have to decrease the amount of menu items inserted inside, it drops down the whole menu, to make it fit in your header and not overlap on the logo.

2) It can be done only by changing the "Grid Width", mentioned in the previous step.

The spacing is done by js script and it cannot be modified in theme options at all.

3) I do not understand at all, can you show me an example or send a link to your website?

Thanks

dreamonventures · October 2020

Thank you for your help. Is there a layout or feature that would allow me to add content in the giant white space in my header next to the logo?:

https://prnt.sc/uqwxd7

My client wants to mirror the header layouts that are similar to these sites:

https://www.hursthardwoods.com/

https://flooringliquidators.net/

Unfortunately, I can't seem to find a layout in BeTheme that works. Any help would be greatly appreciated!

dreamonventures · October 2020

Or is there a way to move the top-right-bar container closer to the center of the page/closer to the header logo?:

https://prnt.sc/uqxx2c

Pablo · October 2020

In this case, if you want to create such advanced header, we strongly suggest to use the "Muffin Header Builder" plugin, see this topic and documentation of that plugin:

https://forum.muffingroup.com/betheme/discussion/42065/the-betheme-header-builder-plugin#latest

https://support.muffingroup.com/documentation/header-builder/

thanks

dreamonventures · October 2020

Thank you. I've played with that plugin before but for this project it's probably not going to work for layout requests my client has made.

As an alternative, is there any way to increase the width of the search bar in the "top-bar-right" container?:

https://prnt.sc/ur6mpl

Pablo · October 2020

Well, we do not have any functionality in the theme options to extend the width of the search bar.

All of the settings available to change in "Top bar right" are available to change in the Theme Options > Header & Subheader > Extras - all of the settings there are customizations for the top bar right.

But, to increase that width, you should create a CSS code.

Thanks

dreamonventures · October 2020

I'm a newbie here. What type of css edit would I need to make to play with the width of that container?

Pablo · October 2020

We strongly suggest not creating CSS code for this purpose because of
responsive issues, and because of this kind of problem, we do not want
to be the source of this CSS tweak.

This CSS will be really advanced code, with many lines to do that - it's not just increasing the 'width' attribute of one element.

You will have to overwrite other attributes on all of the elements inside the header(DOM tree) to make it look proper on all desktop(or even mobile) resolutions.

We have the "Magazine" type of header which will allow you insert some content, exactly the "Banner" area. (https://prnt.sc/uqwxd7)

To insert some content there, please go to the Theme Options > Header & Subheader > Extras

https://prnt.sc/ursrza

If Muffin Header Builder and our basic headers are not going to fit you,
all that we can suggest is to contact some web developer, which will
make some tweaks in HTML and CSS code or use a different plugin for
headers.

Also, we cannot recommend any plugins other
than the ones we support. You can find the list of supported plugins on
this page, in the sidebar:
https://themeforest.net/item/betheme-responsive-multipurpose-wordpress-theme/7758048
thanks

Aligning logo with menu & drop down spacing issue

Comments