[Solved] Action Bar dropdown transparent

coreng · September 2020

Hello,

I am using default theme and instead of social media I have a menu, like in the Language theme https://themes.muffingroup.com/be/language/

I created the following menu but I only see three links and no sub-links:

Downloads

PDF-1
PDF-2

Language

Japanese
English

Contact

All links are Custom links and the URL is #.
I assumed that WP would create automatically a dropdown menu for Downloads and Language.
Can Action Bar have a dropdown?

EDIT: Screenshot my menu https://imgur.com/a/dO3sAHA
I edited the main menu (navbar) and created a dropdown menu without any problems.

Pablo · September 2020

Hello,

The Action Bar cannot have a dropdown because this it have the depth one, and it cannot be extended in easy way, you would have to edit the theme and wordpress core code.

Thanks

coreng · September 2020

Thank you Pablo.

I build one in Impreza 6 Theme, they also have a header builder:

https://imgur.com/a/i1pzwoQ
I build one with BeTheme's header builder but there is a bug:

https://imgur.com/a/Vi2KV0p

Top bar's dropdown menu is transparent, if unfolded I see the link of navigation bar.
It is possible to change the color of dropdown but I still see link of navigation bar.

Pablo · September 2020

We have the Muffin Header Builder, but it does not work with WPML yet.

So, if you want to use WPML dropdown, you have to insert it as a menu item.

If you have any other questions, feel free to ask

thanks

coreng · September 2020

Yes Pablo, could you help me fix my Header Builder issue?

I have two problems but first a screenshot of Header Builder: https://imgur.com/a/ZJwgKpq
Top is action bar, second one is just called First Row.

FYI: The dropdown in action bar is set to display none, if I hoover it set to block. Menu element: <ul class="sub-menu">. And the whole thing is in div class="mhb-item-inner tabletMobile" next element is <ul id="menu-top-right-language-etc" class="menu">

1#
Background is yellow. I could change the color with
background-color:white; in the inspector of Firefox.

Can you tell me which class to select to change the color in the css file
I tried:
.sub-menu {
background-color: white;
}

.sub-menu ul li AND .menu-image-not-hovered li ul AND .menu-image-not-hovered

2#

The dropdown menu is transparent OR bellow the header (main navbar). You can see through the drop down menu (see screenshot, imgur link).

I tried to give it z-index: 999 in inspector, no luck.

Pablo · September 2020

1) You don't have to create a CSS code to change the dropdown menu color, see the screen:

https://prnt.sc/uh29s5

2) Can you send me a link to your website?

Thanks

coreng · September 2020

There is a third problem you will note when you try to select a menu point of the dropdown. As soon mouse leaves, the dropdown menu closes, it is not possible to click on a item of the menu.
https://corporate-energies.group

Pablo · September 2020

Please use this CSS code to fix this problem:

.mhb-row:hover {
    z-index: 999;
    position: relative;
}

thanks

coreng · September 2020

Sorry Pablo it is not working. I could find your suggested css code in source code of the page.

Also tried !important.

Pablo · September 2020

Your CSS code before my CSS is not correct, you did not close the background image attribute.

https://prnt.sc/uhl6af

After changing it, it works fine

thanks

coreng · September 2020

You beautiful man, thank you!

[Solved] Action Bar dropdown transparent

Comments