Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • May 10, 2019 at 10:31 am #1099232
    transformmedia

    Hey,

    I want to use a different menu für mobile. I already created a second menu specifically for mobile. How can I make sure that this is displayed on mobile?

    Best regards

    May 10, 2019 at 6:22 pm #1099376
    Jordan Shannon

    Hey transformmedia,

    You can add the class of noMobile to any menu item you don’t want in the mobile menu.

    If you don’t see the CSS class field check if you have it enabled in Screen Options.

    Best regards,
    Jordan Shannon

    May 13, 2019 at 2:39 pm #1100058
    transformmedia

    Hey Jordan,

    thanks for your reply.

    How can I do this? When I just type in noMobile into the class field there is no change.

    + Is it also possible vice versa like adding a class to a menu item so it only appears on mobile and not on desktop?

    Best regards!

    May 13, 2019 at 2:45 pm #1100062
    Jordan Shannon

    Hi,

    So you only want some links to show on only mobile and some to show on desktop? Are ALL the links currently showing on desktop?

    Best regards,
    Jordan Shannon

    May 16, 2019 at 2:11 pm #1101444
    transformmedia

    Hey Jordan,

    the situation is the following, maybe there is another solution for it:

    It’s about the “Speaking” menu link, I use an anchor because the speaking section is on the same page like the homepage, but on mobile this anchor link doesn’t work because I show a similiar, but different section on mobile for the speaking section and when I use the same anchor-link it doesn’t work. Do you know what I mean?

    That is the problem that I want to solve :)

    May 16, 2019 at 2:22 pm #1101447
    Yigit

    Hi!

    Please go to Appearance > Menus and click on “Screen Options” on the top right and check “CSS Classes” then edit your menu elements and give them custom classes as in example – http://i.imgur.com/RPC1DZz.png
    Then add new custom links without anchors and add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (max-width: 990px) {
.hide-on-mobile { display: none !important; }}
@media only screen and (min-width: 990px) {
.hide-on-desktop { display: none !important; }}

    Regards,
    Yigit

    May 17, 2019 at 8:30 am #1101685
    transformmedia

    Perfect! Thanks, Yigit, this is working! :)

    May 17, 2019 at 3:17 pm #1101821
    Jordan Shannon

    Hi,

    I’m glad this was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Different Menu for mobile’ is closed to new replies.