{"id":48877,"date":"2025-07-25T14:00:58","date_gmt":"2025-07-25T14:00:58","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=features&#038;p=48877"},"modified":"2026-04-29T10:44:49","modified_gmt":"2026-04-29T10:44:49","slug":"mega-menu-widget-overview","status":"publish","type":"features","link":"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/","title":{"rendered":"Mega Menu Widget\/Block"},"content":{"rendered":"\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<p>The <strong>Mega Menu<\/strong> widget\/block is intended to display a previously developed menu; in action, this block\/widget can be observed on the <a href=\"https:\/\/crocoblock.com\/widgets\/mega-menu\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Mega Menu Widget<\/strong><\/a> and <a href=\"https:\/\/crocoblock.com\/livedemo\/jetmenu\/gutenberg\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>JetMenu Demo with Gutenberg Blocks<\/strong><\/a> demo pages.<\/p>\n\n\n\n<p>Additionally, the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/jetmenu\/jetmenu-how-to-create-a-mega-menu-in-elementor\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>How to Create a Mega Menu<\/strong><\/a> guide can be checked to learn how to prepare the mega menu and place it in the website\u2019s <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/how-to-create-a-custom-header-with-jetthemecore\/\" target=\"_blank\" rel=\"noreferrer noopener\">header<\/a>.<\/p>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"mega-menu-widget-settings\"><strong>Mega Menu Widget Settings<\/strong><\/h2>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<p>The widget can be added on a page as any other widget in Elementor \u4e00 by finding the <strong>Mega Menu <\/strong>widget in the search bar and dragging and dropping it where needed.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/inserting-the-mega-menu-widget.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/inserting-the-mega-menu-widget-1024x640.webp\" alt=\"inserting the mega menu widget\" class=\"wp-image-51652\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/inserting-the-mega-menu-widget-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/inserting-the-mega-menu-widget-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/inserting-the-mega-menu-widget-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/inserting-the-mega-menu-widget-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/inserting-the-mega-menu-widget-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/inserting-the-mega-menu-widget.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<p>After inserting the widget, the <strong>Layout<\/strong> block of the <strong>Content<\/strong> settings will be unrolled. Here, the menu will not be displayed on the page until it is selected in the corresponding drop-down list.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"layout-settings\"><strong>Layout settings<\/strong><\/h3>\n\n\n\n<p>The following fields are available:<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-layout-content-settings-of-the-mega-menu-widget.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-layout-content-settings-of-the-mega-menu-widget-1024x640.webp\" alt=\"the layout content settings of the mega menu widget\" class=\"wp-image-51653\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-layout-content-settings-of-the-mega-menu-widget-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-layout-content-settings-of-the-mega-menu-widget-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-layout-content-settings-of-the-mega-menu-widget-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-layout-content-settings-of-the-mega-menu-widget-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-layout-content-settings-of-the-mega-menu-widget-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-layout-content-settings-of-the-mega-menu-widget.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Menu <\/strong>\u2014 a drop-down to select which WordPress menu to display in the <strong>Mega Menu<\/strong>;<\/li>\n\n\n\n<li><strong>Layout <\/strong>\u2014 a drop-down to select the menu view:\n<ul>\n<li><strong>Horizontal<\/strong> \u2014 displays the menu items side by side;<\/li>\n\n\n\n<li><strong>Vertical <\/strong>\u2014 stacks menu items vertically;<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/vertical-layout-of-the-mega-menu-widget.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/vertical-layout-of-the-mega-menu-widget-1024x640.webp\" alt=\"vertical layout of the mega menu widget\" class=\"wp-image-51654\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/vertical-layout-of-the-mega-menu-widget-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/vertical-layout-of-the-mega-menu-widget-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/vertical-layout-of-the-mega-menu-widget-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/vertical-layout-of-the-mega-menu-widget-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/vertical-layout-of-the-mega-menu-widget-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/vertical-layout-of-the-mega-menu-widget.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Dropdown<\/strong> \u2014 displays a \u201c<strong>hamburger<\/strong>\u201d icon that allows users to expand and view the submenu items. Also, it activates the <strong>Dropdown Layout<\/strong> and <strong>Dropdown Position<\/strong> options.<\/li>\n<\/ul>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-hamburger-menu-view-of-the-mega-menu-widget.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-hamburger-menu-view-of-the-mega-menu-widget-1024x640.webp\" alt=\"the hamburger menu view of the mega menu widget\" class=\"wp-image-51655\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-hamburger-menu-view-of-the-mega-menu-widget-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-hamburger-menu-view-of-the-mega-menu-widget-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-hamburger-menu-view-of-the-mega-menu-widget-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-hamburger-menu-view-of-the-mega-menu-widget-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-hamburger-menu-view-of-the-mega-menu-widget-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-hamburger-menu-view-of-the-mega-menu-widget.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Animation<\/strong> \u2014 a drop-down that is available if the \u201cHorizontal\u201d or \u201cVertical\u201d options are set in the<strong> Layout <\/strong>drop-down field. The control is intended to set the animation style when submenus appear (\u201cNone\u201d or \u201cFade\u201d);<\/li>\n\n\n\n<li><strong>Submenu Display<\/strong> \u2014 is available if the \u201cHorizontal\u201d option is set in the<strong> Layout <\/strong>drop-down field. The drop-down list is intended to set the way to display a submenu (\u201cDefault\u201d or \u201cAccordion\u201d). If the \u201cDefault\u201d option is set, the <strong>Submenu Position<\/strong> drop-down will show the \u201cRight\u201d or \u201cLeft\u201d options;\u00a0<\/li>\n<\/ul>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-accordion-option-of-the-sub-menu-display-setting.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-accordion-option-of-the-sub-menu-display-setting-1024x640.webp\" alt=\"the accordion option of the sub menu display setting\" class=\"wp-image-51656\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-accordion-option-of-the-sub-menu-display-setting-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-accordion-option-of-the-sub-menu-display-setting-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-accordion-option-of-the-sub-menu-display-setting-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-accordion-option-of-the-sub-menu-display-setting-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-accordion-option-of-the-sub-menu-display-setting-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-accordion-option-of-the-sub-menu-display-setting.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Sub Menu Trigger<\/strong> \u2014 a drop-down list to specify which user interaction opens the submenu (\u201cHover\u201d or \u201cClick\u201d). If the \u201cClick\u201d option is set, the next fields are active:\n<ul>\n<li><strong>Submenu Target<\/strong> \u2014 sets the \u201cItem\u201d or \u201cSubIcon\u201d;<\/li>\n\n\n\n<li><strong>Sub Menu Close Behavior<\/strong> \u2014 defines how the submenu closes in the click mode: \u201cOn Mouse Leave\u201d or \u201cOn Click Outside\u201d;<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<ul>\n<li><strong>Mouse Leave Delay <\/strong>\u2014 a field to insert a delay time to close the submenu after the cursor exits the menu, depending on the number of milliseconds set (\u201c500\u201d is the default);<\/li>\n\n\n\n<li><strong>Mega Container Width Type<\/strong> \u2014 a drop-down list to define how the width of the mega menu container is calculated. The following options are presented:\n<ul>\n<li><strong>Container<\/strong> \u2014 an option that allows the mega menu to match the width of the main page container;<\/li>\n\n\n\n<li><strong>Selector<\/strong> \u2014 an option that adds a <strong>Custom selector<\/strong> to determine the width;<\/li>\n\n\n\n<li><strong>Items<\/strong> \u2014 an option that allows the mega menu to match the combined width of the parent menu items;<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>Breakpoint<\/strong> \u2014 a drop-down list to set the screen width (in pixels) at which the <strong>Mega Menu<\/strong> switches from desktop to tablet or mobile layout (\u201cNone\u201d, \u201cTablet (&lt;1025px)\u201d, or \u201cMobile (&lt;768px)\u201d options);<\/li>\n\n\n\n<li><strong>Roll Up<\/strong> \u2014 a toggle appearing if the \u201cHorizontal\u201d <strong>Layout<\/strong> and \u201cDefault\u201d <strong>Submenu Display <\/strong>options are activated. The toggle is intended to prevent horizontal overflow by grouping excess items. If enabled, it activates the RollUp Type \u2014 a drop-down list to choose between \u201cText\u201d and \u201cIcon\u201d to display the grouped item. In turn, depending on the specified option, the RollUp text or RollUp Icon field will be shown;<\/li>\n\n\n\n<li><strong>Mega Content Ajax Loading <\/strong>\u2014 a toggle that, if enabled, loads content only when the menu is interacted with. The setting can be useful for optimizing large menus;<\/li>\n\n\n\n<li><strong>Mobile Device Render <\/strong>\u2014 a toggle that activates the <strong>Mobile Menu<\/strong> block of the <strong>Content<\/strong> settings for customizing the menu on mobile devices;<\/li>\n\n\n\n<li><strong>Fill SVG Icons<\/strong> \u2014 a toggle that ensures SVG icons adopt the site\u2019s color styles;<\/li>\n\n\n\n<li><strong>Dropdown Icon<\/strong>, <strong>Toggle Icon<\/strong>, <strong>Opened Toggle Icon<\/strong> \u2014 fields to set icons by uploading SVG files or selecting from the <strong>Icon Library<\/strong>.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"mobile-menu-settings\"><strong>Mobile Menu settings<\/strong><\/h3>\n\n\n\n<p>This block of the <strong>Content <\/strong>settings is available if the <strong>Mobile Device Render<\/strong> toggle of the <strong>Layout<\/strong> settings is enabled.&nbsp;<\/p>\n\n\n\n<p>It contains such options:<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mobile-menu-settings-of-the-mega-menu-widget.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mobile-menu-settings-of-the-mega-menu-widget-1024x640.webp\" alt=\"the mobile menu settings of the mega menu widget\" class=\"wp-image-51657\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mobile-menu-settings-of-the-mega-menu-widget-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mobile-menu-settings-of-the-mega-menu-widget-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mobile-menu-settings-of-the-mega-menu-widget-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mobile-menu-settings-of-the-mega-menu-widget-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mobile-menu-settings-of-the-mega-menu-widget-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mobile-menu-settings-of-the-mega-menu-widget.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Menu for Mobile<\/strong> \u2014 a drop-down to select which WordPress menu to display on mobile devices;<\/li>\n\n\n\n<li><strong>Mobile Device<\/strong> \u2014 a drop-down list to choose if the menu will be shown on only mobile devices, or mobile and tablet devices;<\/li>\n\n\n\n<li><strong>Layout<\/strong> \u2014 a drop-down list to select how the menu appears (\u201cSlide Out\u201d, \u201cDropdown\u201d, \u201cPush\u201d);&nbsp;<\/li>\n\n\n\n<li><strong>Toggle Position<\/strong> \u2014 controls the position (top-left or top-right) of the menu toggle (\u201c<strong>hamburger<\/strong>\u201d icon);<\/li>\n\n\n\n<li><strong>Container Position<\/strong> \u2014 defines where the entire menu panel slides in from (\u201cLeft\u201d or \u201cRight\u201d);<\/li>\n<\/ul>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-container-position-1.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"618\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-container-position-1-1024x618.webp\" alt=\"mobile-menu-container-position\" class=\"wp-image-51658\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-container-position-1-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-container-position-1-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-container-position-1-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-container-position-1-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-container-position-1-600x362.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-container-position-1.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Show Sub Menu Trigger<\/strong> \u2014 defines how users access submenus (\u201cMenu Item\u201d or \u201cSub Marker\u201d);<\/li>\n\n\n\n<li><strong>Show Sub Menu Layout<\/strong> \u2014 defines how submenus are animated (\u201cSlide In\u201d or \u201cDropdown\u201d);<\/li>\n\n\n\n<li><strong>Close After Navigation<\/strong> \u2014 a toggle that, if enabled, causes the menu to close automatically after a link is clicked;<\/li>\n\n\n\n<li><strong>Choose Header Template<\/strong> \u2014 a drop-down list that allows selecting a saved template (e.g., logo\/header info) to display at the top of the mobile menu;<\/li>\n\n\n\n<li><strong>Choose Before Items Template<\/strong> \u2014 a drop-down list to select a saved template before the menu links (e.g., user avatar, CTA button);<\/li>\n\n\n\n<li><strong>Choose After Items Template<\/strong> \u2014 a drop-down list to select a template below the menu items (e.g., social links, footer);<\/li>\n\n\n\n<li><strong>Item Icon Visible<\/strong> \u2014 a toggle that shows icons next to each menu item (if defined in the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/jetmenu\/jetmenu-how-to-create-a-mega-menu-in-elementor\/#choose-a-menu-item\" target=\"_blank\" rel=\"noreferrer noopener\">menu settings<\/a>);<\/li>\n\n\n\n<li><strong>Item Badge Visible<\/strong> \u2014 displays menu item badges (if defined in the menu settings);<\/li>\n\n\n\n<li><strong>Item Description Visible<\/strong> \u2014 shows brief descriptions under menu items (if defined in the menu settings);<\/li>\n\n\n\n<li><strong>Item Divider Visible<\/strong> \u2014 displays a line between items for visual separation;<\/li>\n<\/ul>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-item-divider-visible-1.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"618\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-item-divider-visible-1-1024x618.webp\" alt=\"mobile-menu-item-divider-visible\" class=\"wp-image-51659\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-item-divider-visible-1-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-item-divider-visible-1-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-item-divider-visible-1-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-item-divider-visible-1-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-item-divider-visible-1-600x362.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/mobile-menu-item-divider-visible-1.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Use Breadcrumbs?<\/strong> \u2014 adds a breadcrumb navigation inside the menu (e.g., <strong><em>Home > Products > Shoes<\/em><\/strong>);<\/li>\n\n\n\n<li><strong>Use Toggle Button Loader?<\/strong> \u2014 a toggle that, if enabled, shows a loading spinner when the menu is opening\/closing;<\/li>\n\n\n\n<li><strong>Loader Color <\/strong>\u2014 a field to select a needed loader color among the standard and custom ones;<\/li>\n\n\n\n<li><strong>Toggle Closed State Icon <\/strong>and <strong>Toggle Opened State Icon<\/strong> \u2014 fields to set the needed icon for the corresponding toggles (\u201cNone,\u201d \u201cUpload SVG,\u201d and select from the \u201cIcon Library\u2019);<\/li>\n\n\n\n<li><strong>Toggle Text<\/strong> \u2014 a field to display the needed text on the toggle;<\/li>\n\n\n\n<li><strong>Container Close Icon<\/strong> and <strong>Container Back Icon<\/strong> fields to set the needed icon for the corresponding toggles (\u201cNone,\u201d \u201cUpload SVG,\u201d and select from the \u201cIcon Library\u2019);<\/li>\n\n\n\n<li><strong>Back Text<\/strong> \u2014 a field to insert the corresponding text;<\/li>\n\n\n\n<li><strong>Submenu Icon<\/strong> and <strong>Breadcrumbs Divider Icon<\/strong> \u2014 fields to set the needed icon for the corresponding submenus(\u201cNone,\u201d \u201cUpload SVG,\u201d and select from the \u201cIcon Library\u2019),<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"style-settings\"><strong>Style settings<\/strong><\/h3>\n\n\n\n<p>The <strong>Style<\/strong> settings tab is presented by the <strong>Main Menu<\/strong>, <strong>Dropdown<\/strong>, and <strong>Mobile<\/strong> blocks of settings. The <strong>Mobile<\/strong> block is added if the <strong>Mobile Device Render<\/strong> toggle of the <strong>Layout<\/strong> settings is enabled.\u00a0<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-style-settings.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-style-settings-1024x640.webp\" alt=\"the mega menu style settings\" class=\"wp-image-51660\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-style-settings-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-style-settings-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-style-settings-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-style-settings-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-style-settings-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-style-settings.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<p>Here, the <strong>Icons<\/strong>, <strong>Typography<\/strong>, <strong>Padding<\/strong>, <strong>Space<\/strong>, <strong>Alignment<\/strong>, <strong>Colors<\/strong>, <strong>Background<\/strong>, etc., settings can be customized.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"advanced-settings\"><strong>Advanced settings<\/strong><\/h3>\n\n\n\n<p>The <strong>Advanced<\/strong> settings tab is presented by the <strong>Layout<\/strong>, <strong>Motion Effects<\/strong>, <strong>Transform<\/strong>, <strong>Background<\/strong>, <strong>Borders<\/strong>, <strong>Masc<\/strong>, <strong>Attribute<\/strong>, <strong>Custom CSS<\/strong>, and other groups of settings intended to customize <strong>Margins<\/strong>, <strong>Paddings<\/strong>, <strong>Width<\/strong>, <strong>Position<\/strong>, and others.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-advanced-settings.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-advanced-settings-1024x640.webp\" alt=\"the mega menu advanced settings\" class=\"wp-image-51661\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-advanced-settings-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-advanced-settings-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-advanced-settings-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-advanced-settings-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-advanced-settings-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-advanced-settings.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"mega-menu-block-settings\"><strong>Mega Menu Block Settings<\/strong><\/h2>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<p>The block can be added on a page as any other widget in the Block editor \u4e00 by finding the <strong>Mega Menu<\/strong> block in the search bar and dragging and dropping it where needed.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-in-the-block-editor.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-in-the-block-editor-1024x640.webp\" alt=\"the mega menu block in the block editor\" class=\"wp-image-51662\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-in-the-block-editor-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-in-the-block-editor-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-in-the-block-editor-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-in-the-block-editor-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-in-the-block-editor-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-in-the-block-editor.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<p>The <strong>Mega Menu<\/strong> block\u2019s <strong>General<\/strong> settings are the same as for the widget\u2019s <strong>Layout <\/strong>settings.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-settings.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-settings-1024x640.webp\" alt=\"the mega menu block settings\" class=\"wp-image-51663\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-settings-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-settings-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-settings-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-settings-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-settings-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/the-mega-menu-block-settings.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<p><\/p>\n\n\n\n<p>That\u2019s all about the <strong>Mega Menu<\/strong> widget\/block settings that become available after installing the <em>JetMenu<\/em> WordPress plugin.<\/p>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>This tutorial reveals the Mega Menu widget\/block settings that become available after installing the JetMenu WordPress plugin.<\/p>\n","protected":false},"author":8,"template":"","format":"standard","builder-category":[],"feature-category":[],"article-category":[256],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Mega Menu Widget\/Block Overview \u2014 JetMenu | Crocoblock<\/title>\n<meta name=\"description\" content=\"This tutorial provides a detailed overview of the Mega Menu widget\/block settings that become available after installing the JetMenu WordPress plugin.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Mega Menu Widget\/Block Overview \u2014 JetMenu | Crocoblock\" \/>\n<meta property=\"og:description\" content=\"This tutorial provides a detailed overview of the Mega Menu widget\/block settings that become available after installing the JetMenu WordPress plugin.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/\" \/>\n<meta property=\"og:site_name\" content=\"Help Center\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-29T10:44:49+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/inserting-the-mega-menu-widget-1024x640.webp\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/\",\"name\":\"Mega Menu Widget\/Block Overview \u2014 JetMenu | Crocoblock\",\"isPartOf\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\"},\"datePublished\":\"2025-07-25T14:00:58+00:00\",\"dateModified\":\"2026-04-29T10:44:49+00:00\",\"description\":\"This tutorial provides a detailed overview of the Mega Menu widget\/block settings that become available after installing the JetMenu WordPress plugin.\",\"breadcrumb\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Features\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/features\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Mega Menu Widget\/Block\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"name\":\"Help Center\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\",\"name\":\"Help Center\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"contentUrl\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"caption\":\"Help Center\"},\"image\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Mega Menu Widget\/Block Overview \u2014 JetMenu | Crocoblock","description":"This tutorial provides a detailed overview of the Mega Menu widget\/block settings that become available after installing the JetMenu WordPress plugin.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/","og_locale":"en_US","og_type":"article","og_title":"Mega Menu Widget\/Block Overview \u2014 JetMenu | Crocoblock","og_description":"This tutorial provides a detailed overview of the Mega Menu widget\/block settings that become available after installing the JetMenu WordPress plugin.","og_url":"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/","og_site_name":"Help Center","article_modified_time":"2026-04-29T10:44:49+00:00","og_image":[{"url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/07\/inserting-the-mega-menu-widget-1024x640.webp"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/","url":"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/","name":"Mega Menu Widget\/Block Overview \u2014 JetMenu | Crocoblock","isPartOf":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#website"},"datePublished":"2025-07-25T14:00:58+00:00","dateModified":"2026-04-29T10:44:49+00:00","description":"This tutorial provides a detailed overview of the Mega Menu widget\/block settings that become available after installing the JetMenu WordPress plugin.","breadcrumb":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/crocoblock.com\/knowledge-base\/features\/mega-menu-widget-overview\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/crocoblock.com\/knowledge-base\/"},{"@type":"ListItem","position":2,"name":"Features","item":"https:\/\/crocoblock.com\/knowledge-base\/features\/"},{"@type":"ListItem","position":3,"name":"Mega Menu Widget\/Block"}]},{"@type":"WebSite","@id":"https:\/\/crocoblock.com\/knowledge-base\/#website","url":"https:\/\/crocoblock.com\/knowledge-base\/","name":"Help Center","description":"","publisher":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization","name":"Help Center","url":"https:\/\/crocoblock.com\/knowledge-base\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/","url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","contentUrl":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","caption":"Help Center"},"image":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/features\/48877"}],"collection":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/features"}],"about":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/types\/features"}],"author":[{"embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/users\/8"}],"wp:attachment":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/media?parent=48877"}],"wp:term":[{"taxonomy":"builder-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/builder-category?post=48877"},{"taxonomy":"feature-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/feature-category?post=48877"},{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article-category?post=48877"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}