• Resolved benutzerfreund

    (@benutzerfreund)


    I created a child theme based on twenty thirtyteen which works fine.

    But somehow I broke the menu for small screens. The “Menu” button shows up when the window is smaller than 480px. But nothing happens when I click on it.

    The elements are still there, when inspecting the page I see them in the HTML code.

    You can see the mess here: https://www.benutzerfreun.de

    Any hint appreciated!

Viewing 8 replies - 1 through 8 (of 8 total)
  • Thread Starter benutzerfreund

    (@benutzerfreund)

    Ok, I have no idea why, but the JavaScript which is necessary for this was missing. Adding it to footer.php of my child theme as a developer proposed, did fix this.

    Does anyone have any idea why this happens and where I should place this function correctly – my solutions seems like a bad hack.

    can you please post your footer code, I have the same problem and wanting to see how to add the code
    thanks

    @ron22: If you require assistance then, as per the Forum Welcome, please post your own topic.

    Thread Starter benutzerfreund

    (@benutzerfreund)

    @ron22: As you might have noticed, everything on my site is fine now. The trick was to add this code to footer.php:

    /**
    * Enables menu toggle for small screens.
    */
    ( function() {
    var nav = $( '#site-navigation' ), button, menu;
    if ( ! nav )
    return;
    button = nav.find( '.menu-toggle' );
    if ( ! button )
    return;
    // Hide button if menu is missing or empty.
    menu = nav.find( '.nav-menu' );
    if ( ! menu || ! menu.children().length ) {
    button.hide();
    return;
    }
    $( '.menu-toggle' ).on( 'click.twentythirteen', function() {
    nav.toggleClass( 'toggled-on' );
    } );
    } )();

    I suppose, it is a dirty hack – so if you come up with a better solution, please post this here…

    hej @benutzerfreund,

    sounds good, but does still/again not work on your site, did you notice? im looking for a solution for the same problem and cant solve it! why did u put the code to the footer file, shouldnt it be in the header template? i tried both with my site and nothing works, i see the point of your idea, but cant fix it, so that it works, what else did u try?

    https://mosign.net

    thanks so much, mo

    Thread Starter benutzerfreund

    (@benutzerfreund)

    Hi mo,

    thanks for pointing this out. It used to work, but since it is a hack, it apparently broke with some of the changes or updates that happened meanwhile.

    What fixed it for me now was removing the said code again from footer.php. I know this is odd, and I have no idea what exactly is happening here.

    To make things even more mysterious: there is a single page where it still is broken:
    https://www.benutzerfreun.de/buch-info/

    Maybe one of the experienced developers around here got any idea? Probably you should start your own thread to get noticed by them.

    Please let me know you you can bring any light to this issue!

    Thanks,
    Jens

    hi jens,

    thanks for your help during easter, i tried several things in the meantime and finally solved it! i had another JS in the second widget, had to delete it, now the menu AND the widget are working fine, pooh, im so happy!

    by the way: your buch-info is working perfect for me, did you try one more time?

    liebe gruesse aus wien, mo

    Thread Starter benutzerfreund

    (@benutzerfreund)

    Hi mo,

    Thanks for the update. My conclusion for anyone with this problem: Check your source code and look for JS which is included twice.

    I did not change anything on my site, probably it was an issue with my caching PlugIn…

    Cheers & thanks again for pointing me to this problem on my site,
    Jens

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Smartphone menu broken’ is closed to new replies.