[Resolved] Mobile menu below logo after reloading the page

Home Forums Support Mobile menu below logo after reloading the page

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #893812
    Jasmin

    Dear team,

    thanks again for your awesome theme! On my page the mobile menu at first appears on the top right. When reloading the page on mobile devices it moves below the logo. I would like to have it always on the top right. I already noticed that the issue disappears when I deactivate Autoptimize. I do not manipulate the menu with css, however, I also tried to exclude my child theme’s css from Autoptimize, but this doesn’t solve the issue.

    Thank you in advance.
    Jasmin

    #893882
    David
    Staff
    Customer Support

    Hi there,

    i just tested the site and have not been able to replicate the issue, sometimes the autoptimize cache gets scrambled and re-orders the CSS which may have been cleared.

    You can try adding this to the autoptimize exclusions:

    mobile.min.css

    #893914
    Jasmin

    Hi there,

    thanks for getting back to me. I excluded mobile.min.css, but it doesn’t help. I can see the behavior in Chrome on iPhone6. When I delete the browser cache, it looks good again, but when I reload the page, the menu goes below the logo again.

    #894004
    David
    Staff
    Customer Support

    Which lazy loader are you using as this may be the issue? Can you test by disabling that and flushing caches etc.

    #894849
    Jasmin

    Disabling Autoptimize’s lazy load feature and flushing cashes resolved the issue. So I should probably try a different lazy load plugin or do without it for now.

    Thank you very much, David!

    PS: Frank told me to try to exclude icon-home from lazyloading, but it doesn’t help either.

    #895024
    David
    Staff
    Customer Support

    In the Autoptimize settings you can exclude images by class or file name.
    The class for the logo would be header-image if that doesn’t work then add the image filename instead.

    #895120
    Jasmin

    I tried header-image, the image filename of both logo and the background image, but it didn’t help. I thought, Frank means the icon with the bars. Fortunately he seems to be interested in investigating. We are still testing different Autoptimize settings. (https://wordpress.org/support/topic/lazy-loads-lead-to-switching-mobile-menu/#post-11517396) I will keep you posted if we find a solution.

    #895123
    David
    Staff
    Customer Support

    right – so ignore the image.
    Did you try excluding the CSS file he mentioned?

    #896057
    Jasmin

    Hi David,
    yes, I tried everything, but nothing has helped so far. But Frank seems to be interested in digging deeper to find a solution πŸ™‚

    #896373
    Tom
    Lead Developer
    Lead Developer

    Frank is great – I’m sure he’ll find the issue. Let us know if it’s something we need to fix on our end πŸ™‚

    #897577
    Jasmin

    Thanks, Tom! We are still testing. I just found out that the issue disappears if I exclude png images in general. Let’s see πŸ™‚

    #897682
    Jasmin

    Hi David, hi Tom,

    Packlisten-logo-neu-60.png turned out to be the problem file which has to be excluded from lazy loading in Autoptimize. It is the logo in the floating header which I had not thought of. So we were close when testing the exclusion of the (main) logo…

    So in case other users have problems, they should try to exclude this file.

    Frank’s comment: “I *think* the issue is a bit more complex, as it only occurs in mobile on iOS (well, I haven’t been able to reproduce an Android or in a desktop browser emulating mobile at least). So it looks like the CSS applies differently on webkit (the basis of all iOS browsers) when lazyload is active on that image in the header. Maybe because that image is present twice in the HTML? πŸ™‚”

    “And tell Tom of GeneratePress to reach out to me if he needs any input from me, I’ll be happy to help πŸ™‚”

    #898067
    Tom
    Lead Developer
    Lead Developer

    Strange, I’ll do some tests on it.

    Thanks for reporting back! πŸ™‚

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