{"id":373,"date":"2022-11-24T13:15:08","date_gmt":"2022-11-24T13:15:08","guid":{"rendered":"https:\/\/loftocean.com\/doc\/patiotime\/?post_type=ptkb&#038;p=373"},"modified":"2023-09-01T14:11:21","modified_gmt":"2023-09-01T14:11:21","slug":"mega-menu","status":"publish","type":"ptkb","link":"https:\/\/loftocean.com\/doc\/cozystay\/ptkb\/mega-menu\/","title":{"rendered":"Mega Menu"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"373\" class=\"elementor elementor-373\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-5601604 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"5601604\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-7dd6b83\" data-id=\"7dd6b83\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-d85f683 elementor-widget elementor-widget-text-editor\" data-id=\"d85f683\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><strong>What is Mega Menu?<\/strong><\/p><p>&#8220;A mega menu is typically defined as a drop down interface that is triggered by the user hovering over a link or defined area. This drop down usually shows all options in one main, mega-panel and oftentimes groups related topics into categories.&#8221;<\/p><p>In short, it is a complex drop down menu in a navigation bar.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4da6f34 elementor-widget elementor-widget-text-editor\" data-id=\"4da6f34\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>In CozyStay theme, the&nbsp;<strong>Primary Menu<\/strong>&nbsp;supports mega menu.<\/p>\n<ol>\n<li>When editing your Primary Menu, click the small triangle icon next to a menu item, and you can find the option:&nbsp;<strong>Dropdown Displays a Mega Menu<\/strong>. Please enable it.<\/li>\n<li>Then you can select a&nbsp;<strong>Custom Block<\/strong>&nbsp;from the list, and set the mega menu&#8217;s width and color scheme.<a href=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2022\/11\/mega-menu-1.jpg\"><img fetchpriority=\"high\" decoding=\"async\" class=\"alignnone size-full wp-image-375\" src=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2022\/11\/mega-menu-1.jpg\" alt=\"\" width=\"1976\" height=\"1408\"><\/a><\/li>\n<li>For example, we created a Custom Block called &#8220;Food Menu Dropdown&#8221;,<a href=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2022\/11\/mega-menu-2.jpg\"><img decoding=\"async\" class=\"alignnone size-full wp-image-376\" src=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2022\/11\/mega-menu-2.jpg\" alt=\"\" width=\"1714\" height=\"538\"><\/a>It looks like this:<a href=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2022\/11\/mega-menu-3.jpg\"><img decoding=\"async\" class=\"alignnone size-full wp-image-377\" src=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2022\/11\/mega-menu-3.jpg\" alt=\"\" width=\"1800\" height=\"697\"><\/a><\/li>\n<li>After we set it as the mega menu of one item inside of the primary menu, it looked like this on the website:<a href=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2022\/11\/mega-menu-4.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-378\" src=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2022\/11\/mega-menu-4.jpg\" alt=\"\" width=\"2000\" height=\"634\"><\/a><\/li>\n<\/ol>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"menu_order":0,"template":"","ptkb_category":[6],"class_list":["post-373","ptkb","type-ptkb","status-publish","hentry","ptkb_category-menus"],"_links":{"self":[{"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/ptkb\/373","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/ptkb"}],"about":[{"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/types\/ptkb"}],"version-history":[{"count":2,"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/ptkb\/373\/revisions"}],"predecessor-version":[{"id":1137,"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/ptkb\/373\/revisions\/1137"}],"wp:attachment":[{"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/media?parent=373"}],"wp:term":[{"taxonomy":"ptkb_category","embeddable":true,"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/ptkb_category?post=373"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}