{"id":220339,"date":"2019-11-12T10:45:48","date_gmt":"2019-11-12T10:45:48","guid":{"rendered":"https:\/\/www.megamenu.com\/documentation\/divi-4-copy\/"},"modified":"2019-11-20T09:52:17","modified_gmt":"2019-11-20T09:52:17","slug":"twenty-twenty","status":"publish","type":"ht_kb","link":"https:\/\/www.megamenu.com\/documentation\/twenty-twenty\/","title":{"rendered":"Twenty Twenty"},"content":{"rendered":"\n<h3 class=\"wp-block-heading\">Full Width Sub Menus<\/h3>\n\n\n\n<p>By default the sub menus will only be as wide as the menu itself. To make the Mega Sub Menus span the full width of the page, go to <em>Mega Menu &gt; Menu Themes &gt; Mega Menus<\/em> and set:<\/p>\n\n\n\n<p>Panel Width (Outer): <span class=\"lang:default decode:true crayon-inline\">.header-inner<\/span><\/p>\n\n\n\n<p>Panel Width (Inner): <span class=\"lang:default decode:true crayon-inline \">100%<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Mobile Menu<\/h3>\n\n\n\n<h4 class=\"wp-block-heading\">Option 1: Keep the default theme mobile menu<\/h4>\n\n\n\n<p>To keep the default theme mobile menu, tag your menu to the Desktop Horizontal Menu and Mobile Menu locations, but only enable Max Mega Menu for the Desktop Horizontal Menu location.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twentytwenty-mobile-menu.png\"><img loading=\"lazy\" decoding=\"async\" width=\"2646\" height=\"1692\" src=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twentytwenty-mobile-menu.png\" alt=\"\" class=\"wp-image-220347\" srcset=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twentytwenty-mobile-menu.png 2646w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twentytwenty-mobile-menu-300x192.png 300w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twentytwenty-mobile-menu-768x491.png 768w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twentytwenty-mobile-menu-1024x655.png 1024w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twentytwenty-mobile-menu-50x32.png 50w\" sizes=\"auto, (max-width: 2646px) 100vw, 2646px\" \/><\/a><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Option 2: Replace the mobile header with Max Mega Menu<\/h4>\n\n\n\n<p>Go to <em>Appearance &gt; Customize &gt; Additional CSS<\/em> and add the following:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted lang:default decode:true \">@media (max-width: 1000px) {\n     body.mega-menu-primary .header-titles-wrapper {\n         display: none;\n     }\n     body.mega-menu-primary .primary-menu-wrapper,\n     body.mega-menu-primary .header-navigation-wrapper,\n     body.mega-menu-primary ul.primary-menu {\n         display: block;\n         margin: 0;\n     }\n }<\/pre>\n\n\n\n<p>The &#8220;Desktop Horizontal Menu&#8221; will now be displayed for both desktop and mobile.<\/p>\n\n\n\n<div class=\"wp-block-columns has-2-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h4 class=\"wp-block-heading\">Before<\/h4>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"581\" height=\"1024\" src=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-before-581x1024.png\" alt=\"\" class=\"wp-image-220350\" srcset=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-before-581x1024.png 581w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-before-170x300.png 170w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-before-768x1353.png 768w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-before-28x50.png 28w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-before.png 1008w\" sizes=\"auto, (max-width: 581px) 100vw, 581px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h4 class=\"wp-block-heading\">After<\/h4>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"581\" height=\"1024\" src=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-after-581x1024.png\" alt=\"\" class=\"wp-image-220352\" srcset=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-after-581x1024.png 581w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-after-170x300.png 170w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-after-768x1353.png 768w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-after-28x50.png 28w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2019\/11\/twenty-twenty-after.png 1008w\" sizes=\"auto, (max-width: 581px) 100vw, 581px\" \/><\/figure>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Full Width Sub Menus By default the sub menus will only be as wide as the menu itself. To make the Mega Sub Menus span the full width of the page, go to Mega Menu &gt; Menu Themes &gt; Mega Menus and set: Panel Width (Outer): .header-inner Panel Width (Inner):&#8230;<\/p>\n","protected":false},"author":1,"comment_status":"open","ping_status":"open","template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","footnotes":""},"ht-kb-category":[15],"ht-kb-tag":[],"class_list":["post-220339","ht_kb","type-ht_kb","status-publish","format-standard","hentry","ht_kb_category-theme-integration"],"uagb_featured_image_src":[],"uagb_author_info":{"display_name":"Tom Hemsley","author_link":"https:\/\/www.megamenu.com\/author\/megamenu\/"},"uagb_comment_info":0,"uagb_excerpt":"Full Width Sub Menus By default the sub menus will only be as wide as the menu itself. To make the Mega Sub Menus span the full width of the page, go to Mega Menu &gt; Menu Themes &gt; Mega Menus and set: Panel Width (Outer): .header-inner Panel Width (Inner):...","_links":{"self":[{"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb\/220339","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/comments?post=220339"}],"version-history":[{"count":9,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb\/220339\/revisions"}],"predecessor-version":[{"id":221399,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb\/220339\/revisions\/221399"}],"wp:attachment":[{"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/media?parent=220339"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb-category?post=220339"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb-tag?post=220339"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}