Integrating mmenu plugin
jQuery.mmenu allows to create more complex mobile menus with true native app menu experience and sliding submenus. Chap does not include this plugin by default, but with the following guide it can be integrated into the theme.
To make persistent changes to Chap mobile menu a file needs to be copied over to the child theme folder to ensure updates don’t overwrite your changes.
The mobile menu is rendered in
/chap/lib/template-functions/action-chap-render-mobile-menu.php file, so it should be copied to
Chap menus use a custom walker to create output compatible with Semantic UI. How ever this isn’t compatible with mmenu so the function
chap_render_mobile_menu() in the child theme’s
action-chap-render-mobile-menu.php file should be modified to output a menu using the default WordPress menu walker.
This will output a menu that mmenu can use to populate it’s items from.
The menu created in the previous step is not styled properly and is only used for it’s data, so it should be hidden from view.
The following CSS can be added in the
WordPress admin dashboard -> Chap Theme -> Code -> CSS textarea.
Now the mmenu WordPress plugin should be downloaded, installed and activated. Once done, a separate “mmenu” menu item will be displayed in the dashboard.
The plugin can be configured to use the previously created menu for data and an already existing main menu item to show it.
The mmenu plugin is now integrated and can be further configured to your liking, such as menu position, navigation, logo, photo, search field and custom buttons.
mmenu may not support all menu structures that Chap allows, only basic nesting.