menu style in the header

Hi There,
Please, How can I achieve menu style me like the attached in the header? with or without the search.

I am currently using the default menu style in the header.

Thank you.

Attachments:

You must be logged in to view attached files.

Hello,

1. Add the main menu element in the second column and the search element in the third column https://gyazo.com/5d54261316564b8ff2269bd2d2946983

2. Enter the row and determine the flex-layout as shown in the video screen above https://xtemos.com/docs/woodmart/header-builder/header-rows-columns-configuration/

3. Add the background to the menu item by means of custom CSS, we shall help if necessary.

Best Regards

Hi Elise, I am stuck. I have been trying to achieve the menu for over 4 days now but I couldn’t.

Please, I need further help to achieve this.

Thank you

Hello,

Please provide your site admin access. Do you need the search or not?

Best Regards

Ok thank you, Yes please if you can for search too

Hello,

Now your header does not have the search that is why I provide the code for the menu:

body .navigation-style-separated .item-level-0 {
    background-color: blue;
    margin-right: 5px;
}
body .whb-header-bottom .main-nav .item-level-0 > a{
height:30px;
}

Add the code to the Theme Settings > Custom CSS > Global

Best Regards

Hi Elise, Perfect. thank you very much.

You are welcome! If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts