Can you lock the menu to header on mobile?

  • On desktop, my menu remains visible when scrolling down. On mobile, it disappears. How can I adjust the mobile one to also stay visible on screen while scrolling down?

    Running Woocommerce

    Video demo: https://youtu.be/o1TBIbhgjCo

    • This topic was modified 3 years, 4 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Everything else WordPress topic

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

Viewing 5 replies - 1 through 5 (of 5 total)

  • It would probably be easier to get the link to the website to diagnose. You will have to set the menu container to position:fixed;

    This is controlled by the CSS of the theme.
    It is often done with position: sticky. But since

    Sticky positioning can be thought of as a hybrid of relative and fixed positioning.

    (MDN)
    and fixed position is related to the viewport, both fixed and sticky can be a problem on mobile devices that define the viewport differently than desktop.
    The usual workaround is to remove fixed or sticky positioning on mobile.
    But you should ask at your theme’s support forum for the details on what that theme does.

    Thread Starter fabrikahawaii

    (@fabrikahawaii)

    @guzmanariel525 [ redundant link removed ]

    How do I access the menu container? I assume this is some sort of manual coding?
    I know nothing about it so directions on how to get there would be very helpful.
    Thank you!

    • This reply was modified 3 years, 4 months ago by Jan Dembowski.

    In your WordPress admin, you can go to Appearance -> Customize-> Additional CSS and add the following:

    
.et_fixed_nav #main-header, .et_fixed_nav #top-header, .et_non_fixed_nav.et_transparent_nav #main-header, .et_non_fixed_nav.et_transparent_nav #top-header {
   position: fixed;
}
    Thread Starter fabrikahawaii

    (@fabrikahawaii)

    @guzmanariel525 That worked! Super helpful, thank you again!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Can you lock the menu to header on mobile?’ is closed to new replies.