{"id":699,"date":"2020-08-06T23:57:11","date_gmt":"2020-08-06T23:57:11","guid":{"rendered":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/?p=699"},"modified":"2020-08-19T18:42:15","modified_gmt":"2020-08-19T18:42:15","slug":"displaying-menus","status":"publish","type":"post","link":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/2020\/08\/06\/displaying-menus\/","title":{"rendered":"Displaying Menus"},"content":{"rendered":"\n<h4 class=\"wp-block-heading\">Menus In Header<\/h4>\n\n\n\n<p>You can display menus in header using header builder Navigate to&nbsp;<code>Molla &gt; Theme Options &gt; Header &gt; Header Builder<\/code>.<\/p>\n\n\n<div class=\"notice-info\">NOTE:<br>Molla supports <strong>Main Menu<\/strong> header element and you can show main menu ( whose location is \u201cMain Menu\u201d ) in header.<\/div>\n\n\n<p>You are able to display any menu you created with <strong>Custom Menu<\/strong> header element. Follow step by step:<\/p>\n\n\n\n<p><strong>Step 1<\/strong>&nbsp;\u2013 Navigate to&nbsp;<code>Molla &gt; Theme Options &gt; Header &gt; Header Builder<\/code> and drag &amp; drop <strong>Custom Menu<\/strong> element in header section.<\/p>\n\n\n\n<p><strong>Step 2<\/strong>&nbsp;\u2013 Click placed <strong>Custom Menu<\/strong> element, you could see related options left top of customizer options.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"500\" height=\"800\" src=\"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-content\/uploads\/sites\/40\/2020\/08\/menu-19.jpg\" alt=\"\" class=\"wp-image-706\" srcset=\"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-content\/uploads\/sites\/40\/2020\/08\/menu-19.jpg 500w, https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-content\/uploads\/sites\/40\/2020\/08\/menu-19-188x300.jpg 188w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><\/figure>\n\n\n\n<p><strong>Step 3<\/strong>&nbsp;\u2013 Select menu and set other option.<\/p>\n\n\n\n<ul><li><strong>Enable Toogle Menu<\/strong> &#8211; show menu as normal or vertical toggle menu<\/li><li><strong>Toogle Menu Title<\/strong> &#8211; toggle title to display when menu is set as toggle menu<\/li><li><strong>Link Url<\/strong> &#8211; toggle title&#8217;s link url ( does not work when below options is not set as \u201cMouse Over\u201d )<\/li><li><strong>Menu Active Events<\/strong> &#8211; when toggle menu is displayed<\/li><li><strong>Show Icon<\/strong> &#8211; show icon with toggle title that represents toggle menu&#8217;s active status<\/li><li><strong>Icon Class<\/strong> &#8211; icon class when toggle menu is not opend<\/li><li><strong>Active Icon Class<\/strong> &#8211; icon class when toggle menu is opend<\/li><li><strong>Icon Position<\/strong> &#8211; before \/ after toggle menu title<\/li><li><strong>Menu Skin<\/strong> &#8211; set menu skin<\/li><\/ul>\n\n\n\n<p><strong>Step 4<\/strong>&nbsp;\u2013 After finished setting menu options, click \u201cSave\u201d button at the bottom. Click \u201cPublish\u201d button to save options.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Menus In Elementor Page<\/h4>\n\n\n\n<p>Molla helps you printing menu with various type &amp; theme option.<\/p>\n\n\n\n<p><strong>Step 1<\/strong>&nbsp;\u2013 Navigate to&nbsp;<code>WORDPRESS TAB<\/code>, you can easily find <strong>Molla Navigation Menu<\/strong>. Place it in your page as you want.<\/p>\n\n\n\n<p><strong>Step 2<\/strong>&nbsp;\u2013 Set widget options.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"299\" height=\"416\" src=\"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-content\/uploads\/sites\/40\/2020\/08\/menu-20.jpg\" alt=\"\" class=\"wp-image-717\" srcset=\"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-content\/uploads\/sites\/40\/2020\/08\/menu-20.jpg 299w, https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-content\/uploads\/sites\/40\/2020\/08\/menu-20-216x300.jpg 216w\" sizes=\"(max-width: 299px) 100vw, 299px\" \/><\/figure>\n\n\n\n<p><strong>Step 3<\/strong>\u00a0\u2013 After setting menu options, click \u201cAPPLY\u201d button at the top. Click \u201cUpdate\u201d button.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Menus In Header You can display menus in header using header builder Navigate to&nbsp;Molla &gt; Theme Options &gt; Header &gt; Header Builder. NOTE:Molla supports Main Menu header element and you can show main menu ( whose location is \u201cMain Menu\u201d ) in header. You are able to display any menu you created with Custom Menu [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[24,62],"tags":[],"featured_image_src":{"landsacpe":false,"list":false,"medium":false,"full":false},"categories_name":["06 - Menus","Displaying Menus"],"author_name":"John Doe","comment_count":{"approved":0,"awaiting_moderation":0,"spam":0,"trash":0,"post-trashed":0,"all":0,"total_comments":0},"_links":{"self":[{"href":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-json\/wp\/v2\/posts\/699"}],"collection":[{"href":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-json\/wp\/v2\/comments?post=699"}],"version-history":[{"count":2,"href":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-json\/wp\/v2\/posts\/699\/revisions"}],"predecessor-version":[{"id":1518,"href":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-json\/wp\/v2\/posts\/699\/revisions\/1518"}],"wp:attachment":[{"href":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-json\/wp\/v2\/media?parent=699"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-json\/wp\/v2\/categories?post=699"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/molla\/documentation\/wp-json\/wp\/v2\/tags?post=699"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}