Archived topic
Left-aligned logo in right aligned menubar
7 replies · Started by Vera on April 9, 2020
I’ve been trying to figure out how to get a small logo that is left aligned in my secondary menu which is right aligned (gray bar at the top). I haven’t been able to find any settings for this in GP and I’m having no luck coming up with the correct CSS. Is it even possible?
Hi there,
I'm not seeing a logo in the secondary navigation currently.
How are you adding it?
I have not been able to add it — I don’t know how. I tried to see if I could display the site logo with CSS but no luck.
If you could tell me the classes I need to use or how to find them, I may have better luck with my experimenting. Normally I use my browser’s code inspector to find these, but it didn’t help in this case.
Try the inside_secondary_navigation hook with a hook element:
https://docs.generatepress.com/article/hooks-visual-guide/
https://docs.generatepress.com/article/hooks-element-overview/
Can you also tell me the classes and tags I would use for displaying a site logo? I'm assuming I would style a div's background enclosed in one or more other divs, but which ones?
I'm afraid I can't make head or tails of hooks. I tried to figure it out when I first got GP a couple years ago and it's no clearer now. It looks like it involves PHP and I only know enough of that to modify existing scripts (with direction). Since this is not a critical element, if I can't accomplish it with CSS, I may have to wait and deal with it another time -- if at all.
Hi there,
Hooks are fairly straight forward - try this:
1. Appearance > GeneratePress and make sure the Elements module is enabled.
2. Appearance > Elements --> New -> Hook.
3. Add your logo image HTML eg.
<img src="url_to_your_image/image.jpg" class="secondary-nav-logo" width=50 height=50 />
4. From the Hook List select:
inside_secondary_navigation
5. Display Rules = set to Entire Site ( or wherever ).
Then just some CSS is required to position it. See if how the above goes and we can assist with the CSS if all ok.
Thank you David! That did it — and my css worked on the first attempt, too. And no php — whew!
Maybe some actual examples in the documentation and before and after effects of using it (including in the video) would spell it out for non-coders like me. Or a resource library of modifiable starter hooks???
Glad to hear that - yeah i think we could do with a few examples :)
