{"action":"created","issue":{"url":"https://api.github.com/repos/BeSite/jQuery.mmenu/issues/280","labels_url":"https://api.github.com/repos/BeSite/jQuery.mmenu/issues/280/labels{/name}","comments_url":"https://api.github.com/repos/BeSite/jQuery.mmenu/issues/280/comments","events_url":"https://api.github.com/repos/BeSite/jQuery.mmenu/issues/280/events","html_url":"https://github.com/BeSite/jQuery.mmenu/issues/280","id":56144151,"number":280,"title":"Simple method to implement mmenu in WordPress","user":{"login":"LebCit","id":10379495,"avatar_url":"https://avatars.githubusercontent.com/u/10379495?v=3","gravatar_id":"","url":"https://api.github.com/users/LebCit","html_url":"https://github.com/LebCit","followers_url":"https://api.github.com/users/LebCit/followers","following_url":"https://api.github.com/users/LebCit/following{/other_user}","gists_url":"https://api.github.com/users/LebCit/gists{/gist_id}","starred_url":"https://api.github.com/users/LebCit/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/LebCit/subscriptions","organizations_url":"https://api.github.com/users/LebCit/orgs","repos_url":"https://api.github.com/users/LebCit/repos","events_url":"https://api.github.com/users/LebCit/events{/privacy}","received_events_url":"https://api.github.com/users/LebCit/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":3,"created_at":"2015-01-31T23:27:00Z","updated_at":"2015-04-03T09:26:21Z","closed_at":null,"body":"Hello everyone,\r\n\r\nFirst of all, a BIG BRAVO, and a million thanks to the developer of mmenu.\r\nSince I've searched a lot and didn't found a tutorial on how to do it,\r\ni made multiple tests and finally found a simple solution.\r\nI really think that  WordPress is great because a lot of persons are ready\r\nto share knowledge for free like the author of this great and cool plugin.\r\nMy contribution to this plugin, is how to implement it in WordPress, so let's go !\r\n\r\n1- In your theme folder, create a new folder **mmenu** and put inside it the two main files **jquery.mmenu.min.all.js** and **jquery.mmenu.all.css** then  enqueue scripts in a function in your functions.php file\r\n```php\r\nfunction mmenu_scripts() {\r\nwp_enqueue_script( 'jquery-mmenu-min-all-js', get_template_directory_uri() . '/mmenu/jquery.mmenu.min.all.js', array('jquery'), '4.7.5', false );\r\nwp_enqueue_style( 'jquery-mmenu-all-style', get_template_directory_uri() . '/mmenu/jquery.mmenu.all.css' );\r\n}\r\nadd_action( 'wp_enqueue_scripts', 'mmenu_scripts' );\r\n```\r\n2- In **header.php** JUST UNDER `<body <?php body_class(); ?>>` put the following code\r\n```javascript\r\n<script type=\"text/javascript\">\r\n  (function ($) {\r\n     $(document).ready(function() {\r\n        $(\"nav#menu\").mmenu({\r\n           \"classes\": \"mm-slide mm-light\",\r\n           \"counters\": true,\r\n           \"footer\": {\r\n              \"add\": true,\r\n              \"title\": \"Footer\"\r\n           },\r\n           \"header\": true,\r\n           \"searchfield\": true,\r\n           \"offCanvas\": {\r\n              \"zposition\": \"front\"\r\n               }\r\n        });\r\n     });\r\n     })(jQuery);\r\n</script>\r\n```\r\nPAY ATTENTION TO LINE 4 `$(\"nav#menu\")`\r\nThis line is assuming that your menu is wrapped in a `<nav>` that have an id of menu !\r\nSo let's create the wp_nav_menu for this one.\r\n\r\n3- In **footer.php** JUST BEFORE `<?php wp_footer(); ?>` put the following code\r\n```php\r\n<nav id=\"menu\">\r\n    <?php wp_nav_menu( array( \r\n    'theme_location' => 'primary',\r\n    'container' => false,\r\n    ) ); ?>\r\n</nav>\r\n```\r\nPAY ATTENTION TO LINE 3 ` 'theme_location' => 'primary'`\r\nThis line is assuming that you are assigning/using the **primary** location menu.\r\nYou should not remove the `'container' => false` line, because it prevents WordPress from wrapping your menu with a `<div>` !\r\n\r\n4- After adding some menu items to the primary location in the back-end of WP,\r\nyou just have to add a single line to see the magic in action.\r\nIn **header.php**, you can put under the  opening `<header>` tag the following line\r\n```html\r\n<a href=\"#menu\">Open the menu</a>\r\n```\r\nNow you will see a link in the header of the theme a **Open the menu** link, just click it :wink:\r\n\r\nFinally, you can play with the options of the plugin as you want and style the link that open the menu to be an icon like the hamburger on the site of mmenu plugin.\r\n\r\nHope that someone will benefit from this very simple integration and make a cool WP menu with mmenu !"},"comment":{"url":"https://api.github.com/repos/BeSite/jQuery.mmenu/issues/comments/89234908","html_url":"https://github.com/BeSite/jQuery.mmenu/issues/280#issuecomment-89234908","issue_url":"https://api.github.com/repos/BeSite/jQuery.mmenu/issues/280","id":89234908,"user":{"login":"nowton","id":1392188,"avatar_url":"https://avatars.githubusercontent.com/u/1392188?v=3","gravatar_id":"","url":"https://api.github.com/users/nowton","html_url":"https://github.com/nowton","followers_url":"https://api.github.com/users/nowton/followers","following_url":"https://api.github.com/users/nowton/following{/other_user}","gists_url":"https://api.github.com/users/nowton/gists{/gist_id}","starred_url":"https://api.github.com/users/nowton/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/nowton/subscriptions","organizations_url":"https://api.github.com/users/nowton/orgs","repos_url":"https://api.github.com/users/nowton/repos","events_url":"https://api.github.com/users/nowton/events{/privacy}","received_events_url":"https://api.github.com/users/nowton/received_events","type":"User","site_admin":false},"created_at":"2015-04-03T09:26:21Z","updated_at":"2015-04-03T09:26:21Z","body":"@FrDH I assume the WP-plug is still in the works? Have been unable to find it, yet, am certainly interested. "}}