Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • September 17, 2020 at 10:02 am #1246475
    mandalova

    Hi there!

    I would like to have the mobile menu sticky.

    Input:

    • Latest versions of the software (WP, theme, plugins)
    • CSS&Javascript file merging and compression – ON
    • Child theme active
    • No other caching plugins

    So I searched for a solution on Google. I found several articles from 2015-2018 and the solution doesn’t seem to work anymore. I tried to add the code in the Quick CSS in the theme as well as in the style.css of the child theme.
    Please find some of those articles:
    #https://kriesi.at/documentation/enfold/header/#sticky-header-on-mobile
    #https://kriesi.at/support/topic/sticky-mobile-menu/
    #https://kriesi.at/support/topic/sticky-mobile-menu-5/

    Then I found that the style sheet that is loaded is not the one I am applying the new code and it is actually one of the “avia-merged-styles” sheets located in /wp-content/uploads/dynamic_avia. So I disabled the merging and compression.
    Then the style sheet has changed to /wp-content/themes/enfold/css/layout.css

    It seems both files are loading after /wp-content/themes/enfold-child/style.css. So I search on Google for “overwrite layout.css enfold” – result:
    #https://kriesi.at/documentation/enfold/add-custom-css/#enqueue-custom-css
    I applied the given code in the /wp-content/themes/enfold-child/functions.php and created wp-content/themes/enfold-child/css/my_custom.css.

    Still don’t work.

    So please, tell me how to make my_custom.css and/or styles.css to be the last to load, so that customizations stay even after update of the parent theme :)

    Thank you,
    Aleksandra

    September 18, 2020 at 12:23 pm #1246777
    Rikard

    Hey mandalova,

    Please send us a temporary WordPress admin login and login URL so that we can have a closer look. You can post the details in the Private Content section of your reply.

    Best regards,
    Rikard

    September 18, 2020 at 1:16 pm #1246810
    mandalova

    Please, find the WordPress admin login in the Private Content section.

    Regards,
    Aleksandra

    September 20, 2020 at 5:20 am #1247057
    Rikard

    Hi,

    Thanks for that. You have an open media query in Quick CSS:

    @media only screen and (max-width: 767px)
.responsive #top #wrap_all #header {
    position: relative !important;
}

    That is likely why the CSS is not working. Please close that properly and try again.

    Best regards,
    Rikard

    September 23, 2020 at 10:16 am #1247802
    mandalova

    Hello Rikard,

    This is not the case.
    The main issue (as other users have reported in previous tickets) is the css stylesheets loading order. Please, refer to my initial request, I tracked back the css style sheets:

    As you suggest, I deleted the open media query from the Quick CSS – noting happend. You could delete it and see for yourself – see the attached pictures as well.

    Please, check again the styles loading order and let me know how to make styles.css to be the last to load.

    Thanks,
    Aleksandra

    • This reply was modified 4 years, 2 months ago by mandalova.
    September 24, 2020 at 5:58 am #1248034
    Rikard

    Hi,

    I removed your broken CSS and added the CSS from the documentation, and your header is now sticky on mobile. You can try to move the code into style.css instead if you like.

    Best regards,
    Rikard

    February 1, 2021 at 5:15 pm #1276882
    mandalova

    Hello Rikard,
    Thank you very much for your support – everything works just fine.
    My apologies for the late reply. You may consider this topic closed.

    Best regards for 2021,
    Aleksandra Mandalova

    February 3, 2021 at 6:34 am #1277243
    Rikard

    Hi Aleksandra,

    Great, I’m glad that things are working now, and thanks for the update. I’ll go ahead and close this thread for now then, please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Sticky Mobile Menu – overwrite layout.css’ is closed to new replies.