Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #664370

    Hi

    I’ve set up a responsive mobile menu as per the instructions in:

    I’ve created two items for the menu but they aren’t displaying. There should be a link to the ‘My Account’ and ‘Cart’ pages (using icons rather than text) but I can’t see them. I’m not sure what I’ve done wrong?

    Also, I’ve moved the search icon to the top (secondary) header using this method
    https://kriesi.at/support/topic/move-search-icon-to-secondary-menu/

    But on the mobile view this forces the top header menu to flow onto two lines as I have info text displayed in this section as well. Is it possible to move the search icon back to the main menu for mobile only?

    Finally, I noticed when viewing the site on a smartphone in landscape, the logo moves to the left. Is there a way to keep it centred, regardless of the orientation?

    I’ve included a mockup image of what I’m hoping to achieve.

    Thanks for your help!

    Nicole

    #665010

    Hey Nicole

    Please add following code to Quick CSS

    @media only screen and (max-width: 767px) {
    .logo a, .logo {
        width: 100%;
    }
    .logo img { margin: auto; }
    .phone-info {
        width: 48%!important;
        float: right!important;
        margin-top: -33px;
    }
    nav.sub_menu {
        width: 46%!important;
        float: left!important;
        clear: none!important;
    }}
    

    Then please refer to this post – http://kriesi.at/documentation/enfold/hide-menu-itemselements-on-mobile/

    Best regards,
    Yigit

    #665137

    Hey Yigit

    Thanks so much for this but it doesn’t seem to be quite right. I’ve included a link to screen captures of what is happening after the Quick CSS is applied – the top header menu info text is now wrapped on 2 lines and the search icon has moved to the left side of the top header menu rather than moving to the main menu.

    I’ve also tried applying CSS Classes to the missing menu items but they still aren’t appearing.

    Also, the logo is still sitting to the left in landscape orientation rather than centred.

    Sorry to be a pain!

    Thanks again

    Nicole

    #665842

    Hi,

    We would be glad to help you with this customization, but at the moment there is no easy way to do this by using a small custom code snippet, so I am afraid its out of the scope of our support.

    But please feel free to request such feature at our feature request system: https://kriesi.at/support/enfold-feature-requests/

    This system allows us to keep track of user suggestions and lets you vote on the feature you would like to see the most. I am afraid though there is no guarantee that a feature will get implemented. If that’s something you really need you can always try to hire a developer for the task :)

    Best regards,
    Andy

    #666053

    Hi Andy

    Thanks for your response. Sorry, I’m a bit confused. Do you mean the use of and adding items to the responsive mobile menu is something you can’t assist with? It would be great just to have this functionality to begin with and I can adapt the formatting once I can see how the menu works.

    Thanks for your help.

    Nicole

    #666184

    Hi,

    this thread is very confusing, please use different tickets for different questions/issues.

    Mobile menu:
    Did you changes /enfold/js/avia.js file? because it’s not inside your child theme.
    Can you provide us FTP access please?

    Best regards,
    Andy

    #666249

    Hi Andy

    Sorry, I didn’t like to raise a lot of tickets for queries relating to the same issue but noted for future reference.

    Yes, I have updated the enfold/js/avia.js file and uploaded. I can see it the file structure in my FTP…

    FTP access in private content.

    Thanks for your help.

    Nicole

    #667606

    Hi,

    Your menu items are hidden on mobile because of this code

    @media only screen and (max-width: 767px) {
    .not-mob {
        display: none !important;
    }}

    Can you please elaborate on the changes you would like to make on your menu so we can correct the errors?

    Unfortunately, creating such layout for mobile header would be out of the scope of our support as Andy mentioned. But please feel free to request such feature here – https://kriesi.at/support/enfold-feature-requests/

    Best regards,
    Yigit

    #667625

    Hey Yigit

    Thanks for your help. I knew it was something I was doing wrong but couldn’t figure out what. I totally understand the mock up I’ve provided is outside of what you can assist with.

    It’s hard to know what changes I’d like as I don’t know what the menu looks like. I was hoping to display a link to the ‘My Account’ and ‘Cart’ in someway. On the desktop version I have these links in the top header menu (red menu) but there isn’t enough room to do this on the mobile display. So I removed them from the mobile view using the code you mentioned above.

    If you can help me to get the mobile menu to display with the ‘My Account’ and ‘Cart’ links that would be a big help!

    Many thanks
    Nicole

    #667633

    Hey!

    Would you like to display “My account” and “Cart” links in your main menu only on mobile?
    If you do, please go to Appearance > Menus and add these two menu items to your main menu and give them a custom CSS class “main-only-mob” and then add following code to Quick CSS

    @media only screen and (min-width: 990px) {
    .main-only-mob { display: none !important; }}

    They will be hidden on screen sizes larger than 990px

    Regards,
    Yigit

    #667647

    Hey Yigit

    Thanks for this – this solution works really well.

    Thanks for your help.

    Kind regards

    Nicole

    #667652

    Hi!

    You are welcome Nicole! Let us know if you have any other questions or issues :)

    Regards,
    Yigit

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