Sticky Header Menu Issue

  • Resolved danishcid

    (@danishcid)


    8 months, 2 weeks ago

    Hi All,
    I’m facing an issue related to sticky header I hope that sone one can help me with this issue, I’m using “my sticky menu” plugin, when I set the main menu to be sticky, it also make the top menu sticky along with it, I dont want the top menu to be sticky, I only want the main menu to be sticky. Is there a way to only make the main menu sticky using the CSS code?
    Following is the link to my site
    https://test.troogs.com/personal-trainer/

    Regards,
    Danish

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Support Karina

    (@karinapremio)

    Hi, thanks for reaching out! Can you please open the My Sticky Menu plug-in settings, go to the ”Sticky menu” settings, choose ”Other class or ID” from the ”Sticky class” dropdown and try adding this class: .ast-primary-header-bar to see if it helps?
    Please let me know how it goes! ??

    Thread Starter danishcid

    (@danishcid)

    Hi Karina,
    Thanks for the kind reply, I have tried the class:?.ast-primary-header-bar but astra theme has different classes for different screens (desktop, mobile, tablet). If I add class:?.ast-primary-header-bar, it will only work with the desktop screen, the tablet screen and the mobile screen will have no affect of sticky menu since they have different classes (.ast-builder-grid-row-tablet-layout-default, .ast-builder-grid-row-mobile-layout-default) for that.

    Regards,
    Danish

    • This reply was modified 8 months, 1 week ago by danishcid.
    • This reply was modified 8 months, 1 week ago by danishcid.
    • This reply was modified 8 months, 1 week ago by danishcid.
    • This reply was modified 8 months, 1 week ago by danishcid.
    Plugin Support Karina

    (@karinapremio)

    Thanks for giving it a try! Can you please check with this ID instead: #masthead?

    Thread Starter danishcid

    (@danishcid)

    Hi Karina,

    I tried using the id: #masthead but it seems like it also includes the top header and it didn’t work. Is there a way to make the size of the sticky header a bit smaller when scrolling down so that the sticky header won’t cover a lot of space on the screen while scrolling?

    Regards,
    Danish

    Plugin Support Karina

    (@karinapremio)

    Hey again Danish,

    I’m afraid then that your theme doesn’t provide a common class that will a) work on all devices and b) not include the top banner. I would then recommend checking with your theme developer if it’s possible to create/ add a class or ID that will only include the navigation across all devices. For our Astra customers, #masthead usually works across devices but in this case it’s not good because of the top bar you wish to exclude.

    As to your other question, I’m afraid there is no readily available setting to adjust the sticky menu size (it will inherit your header size). It may be done via custom CSS, however I am afraid these customisations are not available on our end.

    I remain at your service for any further questions or concerns!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Sticky Header Menu Issue’ is closed to new replies.