title & social to menu bar

Hi,

I’d like to place my logo/title within the header menu bar if possible. I’ve managed to get the title in a fixed position, but I can’t figure out how to move it into the centre of the header.

I’d also like to move the social icons into the header in place of the search bar. I know there are threads discussing these two issues already, but I can’t seem to get it to work.

Thanks in advance,

Genia

Hi Genia,

I hope you are well today and thank you for your questions.

I’d like to place my logo/title within the header menu bar if possible. I’ve managed to get the title in a fixed position, but I can’t figure out how to move it into the centre of the header.

Have you used the CSS solution shared in the following topic to achieve it?

https://colorlibsupport.com/t/logo-to-menu-bar/#post-66915

If it is not working for you then could you please share me your site URL where it’s happening so that i can troubleshoot it?

I’d also like to move the social icons into the header in place of the search bar. I know there are threads discussing these two issues already, but I can’t seem to get it to work.

You can try achieving this using the solutions shared in the following topic.

https://colorlibsupport.com/t/replace-search-bar-on-homepage-with-social-menu/

Best Regards,
Movin

Hey Movin,

I was able to get the child theme in, so the social icons work, however I’d like to space them out. Preferably to resemble the option of social icons in the footer.

I’ve played around with the code a bit to get the logo into the centre of my menu, because the code you sent me had it on the left and it was boxed out of the menu. But the only way I could get it to work was by changing the container background to transparent, which I’m not too keen on because it becomes messy when scrolling over text. Can you help me figure a better method?

Also, I’ve added a photo in the content of my page and it appears above my menu when I scroll. Can I fix this?

Here’s the url to give you a visual: http://www.atelierev.com

Thanks so much for your help!

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Activello Options -> Other -> Custom CSS


nav.navbar.navbar-default {
    z-index: 99999;
}
#masthead #header-menu-social-items li {
    margin-left: 30px;
}