How to add a Max Mega Menu into a block theme?

The WP.org plugin homepage for Max Mega Menu mentions:

FEATURES: […] Display your menu using Automatic Integration, Block, Widget or Shortcode. […] Blocks: This plugin provides 1 block.

Documentation → Menu Output Options currently lists:

• Manual Integration (PHP)
• Shortcode
• Automatic Integration
• Widget

But it does not explain how to create/integrate a Mega Menu into a WordPress block theme.

• @ Maintainer: Please add this to the documentation.
• @ Fellow plugin users: You may use my How To below:

Background Infos:

• Classic Themes have their own mechanisms which menu (Dashboard > Appearance > Menu) is displayed in which part of your website (header, footer, sidebar).
• But in order that

How To:

1. Install and activate the Max Mega Menu plugin.
2. Go to Dashboard > Mega Menu > Menu Locations.
3. You need at least 1 menu location. If you have none, use the button to create / add a new menu location.
   
   a) Location Name: Give it meaningful name
   b) Assign a menu: Select one of your existing menus
   c) Click “Add menu location”.
4. Now the section “Menu Locations” lists the new item.
   
   a) Open it (currently a Harmonica UI which expands/collapses).
   b) General Settings > Set “Enabled” to ON (hint text: Enable Max Mega Menu for this menu location?)
5. Open the Site Editor (by one of the multiple methods, e.g. by Dashboard > Appearance > Editor)
   a) Edit the header (by one of the multiple methods, e.g. Top toolbar, in the center title “Page” click the caret “v” > this opens a dropdown menu > Click the the “?” (more menu) near “Header” > Edit Header.
   b) Into the root of the header (or wrapped in a Row block) create a new block with “+” and then search for “Max Mega Menu”.
   c) This inserts a placeholder block. In it click the dropdpwn menu “Select a location ?” and then select the menu location that you created in step 3.
   Note: v3.1.1 has a bug: Max Mega Menu falsely rendered as bullet list in Site Editor of Block Theme
   The formatting which works in the output is not working in the Site Editor environment. And you end up with a huge bullet list which takes up most of the Site Editor screen real estate. Hence my workaround is the next step.
   d) Alternatively: Insert a Shortcode block. In that block paste the appropriate shortcode, for a newly created menu location by default this will be:
   [maxmegamenu location=max_mega_menu_1]
   This is not a “very visual” user experience which the Site Editor otherwise provides, but at least better then 5d.
   
   

• This topic was modified 1 year, 8 months ago by abitofmind.
• This topic was modified 1 year, 8 months ago by abitofmind.
• This topic was modified 1 year, 8 months ago by abitofmind.