I’m trying to make a menu that looks like the one on this site http://dangerbirdrecords.com
While I can get pretty close by turning the menu off and using links in text blocks, I can’t help but feel that’s going to cause issues further down the road, not least with mobile devices. This is what I’ve done http://bsp-dev.tinyrobot.design/wp/
Is there a way to do this with the actual menu? Setting the options to centre menu and centre logo puts the logo above the menu links – I want them either side.
This is possible but will require a number of customizations which we do not support.
Can you please send over your login credentials so I can give it a try?
I was able to do a simple layout of what you want on this page:
All I did were:
– set the header layout to center logo and menu
– set a negative top margin to the menu so it overlaps with the logo
– added a custom CSS class to the 4th and 5th menu item
– added margin-right to the 4th item and margin-left to the 5th to create space for the logo
The CSS is on the “Gear Icon” on the page’s visual Composer.
One drawback to this is the logo is not clickable since the whole menu stretch is actually overlapping it.
Where did you apply the CSS class? I checked the ‘Test Menu’ under Appearance > Menus and you only rearranged them, thus nullifying the CSS applied for the fourth and fifth item.
If you check the menu items, the CSS is declared there. So you just need to add your CSS class then add the CSS styles for it using the class.
You can add/edit the CSS classes via Appearance > Menus. Each menu item shows a form for css class.
That’s what I thought you meant. I’m probably being blind and/or dimwitted, but I can’t see a field for that:
Please scroll up then click on the arrow beside Screen Options then make sure you put a check on ‘CSS Classes’.
I assumed you were seeing this from your end since I already enabled it from my end.
You must be logged in to reply to this topic.