search

WordPress / twentytwenty

Twenty Twenty is included in Core as of WordPress 5.3 🎉 To report any issues, please go here: https://core.trac.wordpress.org/newticket
Other
301 stars 140 forks source link

Mobile Menu doesn't work for anchor links #936

Closed giorgioriccardi closed 4 years ago

giorgioriccardi commented 5 years ago

I'm testing a scenario where there is only 1 single page and therefore the main and mobile menu are structured on a #anchor-links structure: #project, #about, #and-so-on I did try to use the shortcut url structure /#project and also the full domain path https://my-site.com/#project but there is nothing that is actually triggering the mobile menu to close and reach that url. I will try to debug the js triggers and see if I can find a workaround. In the meantime if anybody has any suggestion, please let me know and I'll work on a patch. Thank you

giorgioriccardi commented 5 years ago

On a search for a solution I also detected the same issue on the Chaplin theme. I hope I can get some support also from their side on this issue. https://wordpress.org/support/topic/mobile-menu-doesnt-work-for-anchor-links/ Thank you!

Jonathlee commented 5 years ago

For single page navigation case, you may need to create additional scripts to highlight the active #project id section you just reached if you wanted to complete the single page navigation manner.

Similar to scroll spy method, for best UX you may need to add smooth scrollto the particular section#id. This feature would complete all possibility especially if we wanted to showcase how Gutenberg block and section can achieve with this new default theme.

Conceptually how it work;

  1. In mobile, click the mobile menu toggler,
  2. Mobile menu revealed
  3. Click on particular link (let say #portfolio)
  4. Menu add menu highlight active class to • Portfolio (may highlight parent/ancestor page)
  5. Mobile menu closed, Mobile menu toggler reversed to default state
  6. Screen will smooth scroll to selected section