Tagged: 

Viewing 18 posts - 1 through 18 (of 18 total)
  • Author
    Posts
  • #646143

    Hi,

    I’ve changed in Enfold settings menu and logo position to “Logo right, Menu left”. Works fine. But on mobile devices the menu is still to the right. I build a mobile website with Enfold, specially for mobile devices and I need the menu to the left. Can you please help me how to change the menu position.

    • This topic was modified 8 years, 5 months ago by Mathuseo.
    #646167

    One additional question to menu for mobile devices. How can I activate sticky menu for mobile devices. In Enfold settings I found this:

    Header > Header behaviour > Sticky Header
    [x] If checked the header will stick to the top of your site if user scrolls down (ignored on smartphones).

    #646668

    Can anyone help?

    #646679

    Hi,

    Sorry for the delay. Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    
    /* Change logo and menu position in tablets and mobile */
    @media only screen and (max-width:767px) {
    #advanced_menu_toggle {
    left: 0!important;
    right:auto!important;
    }
    .logo {
        float: right!important;
        width: auto!important;
    }
    }
    

    Best regards,
    Vinay

    #646697

    Hi Vinay,

    thank you very much.
    Any idea for my second question?

    Best,
    Mathuseo

    #646733

    Hi,

    Sorry i missed that one earlier, to make the header fixed in mobile devices please use the below css

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

    Best regards,
    Vinay

    #891214

    Using the Code above doesnt work anymore. On mobile the menu toogle overlaps the logo.

    /* Change logo and menu position in tablets and mobile */
    @media only screen and (max-width:767px) {
    #advanced_menu_toggle {
    left: 0!important;
    right:auto!important;
    }
    .logo {
    float: right!important;
    width: auto!important;
    }
    }

    Please help and provide new code. We need logo right, menu left like on desktop. Thanks!

    #891217
    This reply has been marked as private.
    #891259

    Hi UPON,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
    @media only screen and (max-width: 767px) {
      .responsive #top #wrap_all .main_menu {
        left: 0;
        right: auto;
      }
    }
    

    If you need further assistance please let us know.

    Best regards,
    Victoria

    #892458

    Great thank you Victoria!

    #892801

    Hi UPON,

    Glad we got it working for you! :)

    If you need further assistance please let us know.

    Best regards,
    Victoria

    #1326634

    Hallo,

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

    Wenn ich diesen Code verwende, dann ist der Header über der Webseite und verdeckt den oberen Teil des Content.

    Wie kann ich das beheben?

    #1326676

    Hi Jui,

    Could you try to explain your intentions a bit further, and post a link to where we can see the actual elements please? If you have a screenshot highlighting your intentions, then please share it with us.

    Best regards,
    Rikard

    #1326696

    Hi Rikard,

    see on the Page. The link is privat.
    the upper part of the page cannot be seen in the mobile view

    you understand?

    best regards

    #1326709

    Hello, the screen

    null

    Der erste Text der Seite verschwindet unter dem Header,
    wenn ich den Code einsetze.

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

    Der header soll auch bei Mobiler Ansicht stehen bleiben.

    **************************

    The first text of the page disappears under the header,
    when I use the code.
    The header should also remain in the mobile view.

    #1326750

    Hi Jui,

    Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 767px) {
    div.container_wrap_first {
        margin-top: 151px;
    }
    }

    Best regards,
    Rikard

    #1326998

    Hi Rikard,

    Thanks, this work perfect!

    Best regards Jui

    #1327097

    Hi,
    Glad Rikard could help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

Viewing 18 posts - 1 through 18 (of 18 total)
  • The topic ‘Change menu and logo position on mobile devices’ is closed to new replies.