Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    Posts
  • #432747

    1) Can we make the mobile menu show on all screen sizes?

    2) Can we add the word ‘menu” to the icon?

    3) The current mobile menu slideout takes up the whole page (when you click on mobile menu icon) Can we adjust it so it only takes up 1/2 to 1/3 of page so you can still see page content?

    Thanks!

    #433270

    Hi Simplify!

    Thank you for using Enfold.

    Add this in the Quick CSS field:

    @media only screen and (max-width: 2600px) {
    .html_mobile_menu_tablet .container #advanced_menu_toggle, .html_mobile_menu_tablet #advanced_menu_hide {
    display: block;
    }
    
    .responsive .av_mobile_menu_tablet .main_menu {
    display: none;
    }
    
    .html_mobile_menu_tablet #mobile-advanced {
    display: block;
    width: 20%;
    right: -20%;
    }}

    Make sure that you set the Header Mobile Menu activation setting to the second option.

    Regards,
    Ismael

    #433424

    thanks for the help. It’s okay on Desktop but on mobile only 1/4 left part of the nav is visible.

    #433426

    Hi!

    Can you post the link to your website please?

    Regards,
    Yigit

    #433445
    This reply has been marked as private.
    #433449

    Hey!

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 990px) {
    .html_mobile_menu_tablet #mobile-advanced {
      display: block;
      width: 100% !important;
      right: -100% !important;
    }}

    Best regards,
    Yigit

    #518297

    Hello !

    It works for me but I’d like my website to be with a boxed layout. With this code, the menu can be seen in small on the upper right corner of the page – and when I open and close it it then disappear.

    Here’s my website, i’m still changing it every two minutes but maybe it’ll help you : delepinay.fr

    Thanks !

    #518515

    Hi,

    Could you post a screenshot highlighting your problem please? I couldn’t find anything obviously wrong on your page. Next time please open a new thread for your problem as old threads tend to get messy and it gets harder for the moderators to help you out.

    Regards,
    Rikard

    #518536

    Hello,

    Soory I removed the boxed layout after some time because my website is still online with visitors. Here’s a screenshot of the problem :
    http://delepinay.fr/wp-content/uploads/2015/10/Capture.jpg

    When I click on the button menu it comes and then when I quit it it disappears : how can I make it invisible from the beginning ?

    Thanks !

    #519044

    Hi,

    You are running an old version of the theme (3.0.4), please update to the latest version (3.3.2) and your problem should go away.

    Thanks,
    Rikard

    #519645

    Hello ! Thank you for your answer !

    I updated the theme -I’ll be careful about that next time ! – but it looks like it just moved the problem :
    now on all small device like ipad it’s not good, the menu is visible at the beginning (http://delepinay.fr/wp-content/uploads/2015/10/Capture2.jpg) (the menu seems to “create” a space on the right at the beginning, but when you open and close it it disappears. (can reproduce that on Chrome “inspect” ctrl+shift+I)

    Another point, about the ergonomy with the boxed layout, before the update, the menu was coming from the border of the central part and it was nice, and now it’s coming from the border of the screen : it’s a bit strange and makes the “close” button of the menu be far away from the “open” one. Here’s a screenshot with some beautiful drawings to explain : http://delepinay.fr/wp-content/uploads/2015/10/Capture3.jpg

    Hope you’ll find why this is happening with the boxed layout !

    Bye

    Guilhem
    http://delepinay.fr

    #520932

    Hi,

    About your first remark, that would take a lot of customisation and is out of theme support unfortunately. About both your remarks; it’s the default behaviour, I’m not really sure what changes you would like to make though?

    Regards,
    Rikard

    #617363

    Hi guys, sorry for bringing up an old post but it is directly related to this one, I have added the above CSS to show mobile menu on desktop up to 3500px when using main enfold theme, however I have just moved to the child-enfold and the above css stops working and shows default menu style is there anything different to add to css when using child theme to get this to work?

    Also I’m having the same problem as above where the menu is showing expanded off the page to the right and makes the page wider (out of sight) which if you slide your courser to the right you will see a smaller version of the pop-out mobile menu (see screen shot) link to DEV site in private content

    Thank you, favourite theme hands down!

    #617383

    Hey!

    Not sure if you are currently using a child theme but we do see a horizontal menu above 3500px as per your description. Please see the attached screenshot. Please refresh the browser cache and review the site again.

    First press F12 to open the Chrome Dev Tools then hold down Ctrl and click on the Reload button.

    Overall the menu looks fine when the mobile menu is is active state as well If this is not what you notice on your browser please open a new ticket and share a screenshot of the issue and the browser details.

    You may have already noticed this one in Enfold > Import/Export > you can easily import the main theme settings to child theme :)

    Regards,
    Vinay

    • This reply was modified 8 years, 8 months ago by Vinay.
    #618024

    Hi Vinnie, no I left the main Enfold theme live so you could see the issue with the small menu hiding to the right of the page when you scroll side ways on the page. As mentioned the menu using the same CSS doesn’t work on child theme, I will now change it over to the child so you can see so please revisit the domain i sent you earlier. As I mentioned the menu looks fine however if you look closely the page will be wider than the screen your looking at it on and you will see a small version of the explanded menu hiding off to the right of the screen as per my screen shot. I have copied all the settings identical to the child theme with the menu not showing as mobile at all on desktops

    #618028

    Can I also add that the little menu off to the right of the page only shows until the menu has been expanded by click the menu icon, if you click this prior then you will not see the fault and need to refresh the page another screen shot attached.

    #619786

    Hey!

    try this code in Quick CSS field:

    ul#mobile-advanced {
    width: 60%;
    }
    

    and adjust as needed.

    Best regards,
    Andy

    #621820

    Hi Andy

    Thanks for sending the CSS, that makes it work great on desktop but on mobile only makes about 1/3rd of the menu show, see screen shot link in private

    Thank you

    #623646

    Hey!

    then add some media queries, so my code from above will work on specific screen sizes only. Something like this:

    @media only screen 
      and (min-width: 768px) {
    ul#mobile-advanced {
    width: 100%;
    }}
    

    Adjust it as needed.

    Best regards,
    Andy

    #641137

    Hi!

    I’ve added in this code and the mobile menu works, but now the transparent, glassy header is not loading correctly as it’s showing just white bar. Is there a fix for this?

    Also, want to center logo on desktop and mobile. Centering with theme options adds the bar below main nav which would normally hold the navigation options.

    Thank you.

Viewing 20 posts - 1 through 20 (of 20 total)
  • The topic ‘mobile menu for desktop and adjustments’ is closed to new replies.