[Resolved] Left-aligned logo in right aligned menubar

Home Forums Support Left-aligned logo in right aligned menubar

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1233175
    Vera

    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?

    Usual environment: 9.7” iPad Pro, iOS 13.4+
    Desktop: Mac OS 10.15.4
    #1233320
    Leo
    Staff
    Customer Support

    Hi there,

    I’m not seeing a logo in the secondary navigation currently.

    How are you adding it?

    #1233381
    Vera

    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.

    Usual environment: 9.7” iPad Pro, iOS 13.4+
    Desktop: Mac OS 10.15.4
    #1234155
    Leo
    Staff
    Customer Support
    #1234530
    Vera

    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.

    Usual environment: 9.7” iPad Pro, iOS 13.4+
    Desktop: Mac OS 10.15.4
    #1235002
    David
    Staff
    Customer Support

    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.

    #1235382
    Vera

    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???

    Usual environment: 9.7” iPad Pro, iOS 13.4+
    Desktop: Mac OS 10.15.4
    #1236332
    David
    Staff
    Customer Support

    Glad to hear that – yeah i think we could do with a few examples 🙂

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.