• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Shifting hamburger Menu on mobile devices

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › General Genesis Framework Discussions › Shifting hamburger Menu on mobile devices

This topic is: not resolved

Tagged: hamburger menu, mobile, shift

  • This topic has 8 replies, 1 voice, and was last updated 2 years, 9 months ago by hutre12386.
Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • February 25, 2021 at 6:20 am #503212
    flyinjam
    Participant

    Hi! I’m having a bit of a speed problem with the mobile hamburger menu. When it first loads, it shows all the menu options like it would by default on desktop without the hamburger menu, then gradually it shifts and turns into the hamburger menu after a couple of seconds or so. Is there a way to stop this from happening? It seems to be causing issues with cumulative layout shift results, also.

    I have previously been pointed in the direction of transitions, but this seems to just manage how long it takes to shift rather than eliminating the shift? Thanks!

    http://www.vinylchapters.com
    February 25, 2021 at 2:36 pm #503217
    AnitaC
    Keymaster

    Hi @flyinjam I think the Genesis developers are working on a solution for this. In the meantime, this is what's working for us so far.

    Install Genesis Js No-JS plugin by Gary Jones - https://wordpress.org/plugins/genesis-js-no-js/.

    Then add this snippet of CSS to your theme.

    .js nav {display: none;}
    @ media only screen and (min-width: 1024px) {
    .js nav {display: block;}
    } 
    

    Note - do not put the space between the @ sign and the word media. I had to do that because the forum was turning it into a link.


    Need help with customization or troubleshooting? Reach out to me.

    March 2, 2021 at 11:47 am #503278
    flyinjam
    Participant

    Thanks Anita, much appreciated. Would I need to amend if the Genesis developers fix it? Also, is there any chance adding this workaround would create any slowdown?

    Thanks

    March 2, 2021 at 12:56 pm #503281
    AnitaC
    Keymaster

    Hi @flyinjam from my usage it's not slowing anything down. It just makes the hamburger menu behave better. What tools are you using to check for layout shift? Are you using Chrome with Lighthouse where it turns things blue that shift?


    Need help with customization or troubleshooting? Reach out to me.

    March 2, 2021 at 1:58 pm #503283
    flyinjam
    Participant

    Hi Anita,

    Yes, it's definitely behaving better than it was!
    As for testing CLS, I'm just using PageSpeed Insights and testing a few backend changes through WP-rocket and other things at the moment - it's a bit like getting sucked down a rabbit hole at times, however!

    March 2, 2021 at 2:19 pm #503284
    AnitaC
    Keymaster

    I have seen others complain about WP Rocket. Test your settings with different plugins. I know I am on SiteGround and the SG Optimizer works well. But then if I switch to Autoptimize, it get's better. I posted in the Genesis Facebook group a link to a blog I used for Chrome. If you're in the FB group, go look for it. If not, send me a message on my website and I'll share it with you and how I use Chrome.


    Need help with customization or troubleshooting? Reach out to me.

    March 2, 2021 at 2:29 pm #503285
    flyinjam
    Participant

    I'm using WP-Rocket and Autoptimize at the moment. I'm on tsohost as a host at the moment but I have heard good things about SiteGround and the SG Optimizer. I've just requested to join the FB group and I'll search for your post when accepted. If I can't find it I'll drop you a message. Thanks again for this great help.

    March 2, 2021 at 2:47 pm #503286
    AnitaC
    Keymaster

    You're welcome. Hope to see you soon on Facebook!


    Need help with customization or troubleshooting? Reach out to me.

    September 3, 2022 at 1:00 pm #505754
    hutre12386
    Participant

    I have a toolbar and navigation drawer activity in android. Now I want to shift ham burger icon (navigation drawer icon) to right side of hy-veesurvey.com

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.
Log In

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2025 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble