[Support request] Sticky Header ?

Home Forums Support Sticky Header ?

  • This topic has 13 replies, 4 voices, and was last updated 1 week ago by David.
Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #1436479
    David

    Hi All,

    I’m converting a site over to GP/GB and the old site used UberMenu.
    We are staying with that plugin and have upgraded it to the latest version.
    That menu plugin has it’s own sticky add-on which works great, but it only makes the menu sticky & is not full width.
    Where on the current live site, the header is sticky and full width:
    https://www.triumph.com.au/

    I’ve linked the temporary domain we are working on below.
    I have turned off the UberMenu sticky feature for now.
    So wondering how we can achieve that ?
    TIA, Dave

    #1436873
    Leo
    Staff
    Customer Support

    Hi there,

    Can you turn the sticky option on so we can see the issue?

    This might be something you will need to check with the plugin support but we can check to make sure 🙂

    #1437332
    David

    Thanks Leo,
    The sticky menu within the customizer was on, so I assume you mean the UberMenu sticky, that is on now!
    I’ll also post a support ticket with UberMenu.

    I did notice within the UberMenu settings for sticky, there is an option:
    ‘Expand the menu bar to the full width of the viewport when in sticky mode’ which was always on?

    Dave

    #1437413
    Leo
    Staff
    Customer Support

    From what I can see, the entire menu system is all coming from Uber menu so there isn’t anything we can do from GP.

    Were you able to get an answer from them?

    Let me know 🙂

    #1437453
    David

    Thanks Leo,
    I have a list of questions for UberMenu, will be sending that through shortly – I’ll keep you updated.
    Best regards, Dave

    #1437461
    Leo
    Staff
    Customer Support
    #1451477
    David

    Hi Leo & team,
    Just coming back to this.
    UberMenu support got back.
    >>>>>>
    So the UberMenu Sticky Extension is UberMenu-specific; it’ll only make UberMenu sticky (which is why it’s called a “Sticky Menu” and not a “Sticky Header”). The theme’s header could use any markup or have any style applied, so the Sticky Extension can’t control that unfortunately.

    Normally the theme would have a sticky header option (though like you said it hasn’t been updated), but alternatively you could either just make it a fixed header (set the position to fixed and add padding to the body via CSS) or look for a generic sticky header solution.
    <<<<<<

    So I have turned off the UberMenu sticky option, and turned on the GP sticky menu.
    Can you take a peek now and let me know if there is any reason why it does not work ?
    TIA Dave

    #1451577
    Elvin
    Customer Support

    Can you take a peek now and let me know if there is any reason why it does not work ?

    GP Premium’s menu plus sticky option applies to the <nav> used by the theme/plugin. It can’t control the <nav> menu created with ubermenu because it doesn’t have the classes and attributes GP uses to apply its script.

    But we can try this:

    Go to Appearance > Customize > Layout > Header and check “Use Navigation as Header”.

    You can then go to Appearance > Customize > Layout > Sticky Navigation and set it to On.

    Now test if the header menu is sticky. We’re basically trying to wrap all header contents into 1 <nav> that uses the the proper selectors for the GP script.

    Note: You may have to activate Menu Plus on WP Admin Panel > Appearance > GeneratePress if the options mentioned isn’t visible.

    Let us know if it works for you.

    #1451580
    David

    Thanks Elvin,
    Appreciate the feedback.
    I made the changes, but no sticky yet!

    Also the UberMenu has moved aligned right & no bottom padding ?
    That maybe their settings need adjusting now.

    Any other thoughts ?

    TIA, Dave

    #1452010
    David
    Staff
    Customer Support

    Hi there,

    so like UberMenu – its sticky only works with its navigation. The same goes for the Themes sticky Nav.

    If you want to disable GP sticky and re-enable the UberMenu sticky – i can take a look at why its not filling the space.

    #1452092
    David

    Thanks David,

    So the Uber sticky is back on, and the GP sticky settings turned off along with Use Navigation as a header turned off!

    Dave

    #1452117
    David
    Staff
    Customer Support

    Try adding this CSS:

    .ubermenu-sticky .ubermenu-main .ubermenu-nav {
        max-width: 100%;
        display: flex;
    }
    
    .ubermenu-sticky .ubermenu .ubermenu-item.ubermenu-item-level-0 {
        flex: 1;
    }
    #1452153
    David

    Thanks David,
    That is better…
    The only thing now is the sub-menu’s drop down full width (that might be something I can look at in the UberMenu settings.
    And I need to logo in there too.
    Late here, I’ll revisit in the morning…
    Regards, Dave

    #1452211
    David
    Staff
    Customer Support

    Hmmm not sure how we’ll add a Logo in there as its all UberMenus markup – might be worth asking them.

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