Navbar logo centered with entries left and right

[KITCHENTOWN]

Hey guys,
I’m trying to achieve the following design for the navbar;

so I need to place the logo in the middle with entries left and right. Can’ figure it out.
I’m using Icon stack.

Thanks for any advice!

[rad]

Hi there,

Thanks for writing in.

It’s doable in Pro header, you can add a header bar in your Pro header builder. Then add a container in your header bar and inspect it, you should find the Flex Layout section, make sure it’s set to row. Then while inspecting your container, go to Self Flex section and select Fill Space Equally in Preset option.

Then in that container, add your first inline menu (left), and an image element (centered logo), then another menu (right) or just a simple link and a button.

Hope this helps.

[KITCHENTOWN]

Okay. I don’t have the pro version though. Is there any other way?

[jade]

Hi there,

The header layout that you’re aiming for is still available with X though it would require a bit of customization using CSS. You will have to target the menu items and space them out through CSS but it will be tricky to implement because you will have to adjust and write more CSS to handle the menu’s responsiveness.

Another option is to override the header theme file using a child theme.

The file that you need to override is the _navbar.php that is in x\framework\legacy\cranium\headers\views\global\

You will have to copy the file in x-child\framework\legacy\cranium\headers\views\global\ and make your changes there.

You may add the additional blocks in the file like the logo in the center and the buttons on the right then you can write so CSS file to set their alignment.

Best Practices | Themeco Docs

Hope this helps you get started.