![\"mega1\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega1.png\")
<\/p>\nOnce ‘The Maxhost Extensions’ plugin is activated ‘Mega Menu’ is available in your admin panel dashboard.<\/p>\n
<\/p>\n
Enable WPBakery for Mega Menu (2 Steps) 1. Navigate to WPBakery > Role Manager Add a new Mega Menu item (6 Steps) 1. Navigate to Mega Menu > Add New 4. Click on ‘Add Element’ and from the elements popup choose ‘Ft- Mega Menu – Image’<\/strong>, ‘Ft- Mega Menu – Paragraph’<\/strong> or ‘Ft- Mega Menu – List Items’<\/strong><\/p>\n Note: Each element should be in one single column. Do not insert more than one mega menu element in one column.<\/p>\n 5. In the Mega Menu elements settings popup you can fill the form by inputting your menus, urls, image, paragraph and icons.<\/p>\n 6. Click on Publish button. <\/p>\n Adding Mega Menu item as a submenu to a top level menu item (7 Steps) 1. Navigate to Appearance > Menus. 5. Now check the Test Mega Menu item and click on Add to menu. 6. Drag the Test Mega Menu item box and drop it under any existing menu as a submenu<\/p>\n 7. If you want the menu as wide as you see in the theme preview, write ‘wide-menu’ in the CSS Class field of the parent menu. In this case ‘Blog’ is the parent menu of the sub Mega Menu<\/p>\n 8. Now the Mega Menu is added as a submenu of Blog and it should look like this:<\/p>\n Important Note: Please do not use Mega Menu as a top level menu item or as submenu menu item beyond level 1. Do not use other menu items with Mega Menu item.<\/strong><\/p>\n <\/p>\n","protected":false},"excerpt":{"rendered":" Once ‘The Maxhost Extensions’ plugin is activated ‘Mega Menu’ is available in your admin panel dashboard. Enable WPBakery for Mega Menu (2 Steps) 1. Navigate to WPBakery > Role Manager 2. In Post Types choose ‘Custom’ and then make sure maxhost_mega_menu is checked. Add a new Mega Menu item (6 Steps) 1. Navigate to Mega […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[8],"tags":[],"_links":{"self":[{"href":"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-json\/wp\/v2\/posts\/78"}],"collection":[{"href":"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-json\/wp\/v2\/comments?post=78"}],"version-history":[{"count":0,"href":"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-json\/wp\/v2\/posts\/78\/revisions"}],"wp:attachment":[{"href":"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-json\/wp\/v2\/media?parent=78"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-json\/wp\/v2\/categories?post=78"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-json\/wp\/v2\/tags?post=78"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
\n<\/strong><\/p>\n
\n2. In Post Types choose ‘Custom’ and then make sure maxhost_mega_menu is checked.![\"mega2\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega2-1024x287.png\")
<\/p>\n
\n<\/strong><\/p>\n
\n2. Give it a title, lets say “Mega Menu One” item. The title is not used anywhere in displaying the menu.
\n3. Click on Backend Editor. It will display WPBakery Backend Editor. We will use this back end editor to build our Mega Menu item.![\"mega3\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega3-1024x323.png\")
<\/p>\n![\"mega4\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega4-1024x395.png\")
<\/p>\n![\"mega6\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega6-1024x452.png\")
<\/p>\n
\nNote: If you use WHMCS<\/strong>, do not click on Publish button yet. Click on ‘Classic Mode’<\/strong> button and then remove vc_row<\/strong> and vc_coumn<\/strong> shortcodes from first line and from the last line as shown in the below screenshot. After that click on ‘Publish’<\/strong> button. It is important to follow this step if you implement Maxhost WHMCS template with your website. If you do not follow this step, the Mega menu will look fine in your main website pages, but it may break in WHMCS pages.<\/p>\n![\"mega-menu-two\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega-menu-two-1024x296.png\")
<\/p>\n
\n<\/strong><\/p>\n
\n2. On top right corner of your screen, you will find a dropdown menu Screen Options. Click on it.
\n3. Make sure ‘Mega Menu Post’ and ‘CSS Classes’ are checked.
\n![\"mega7\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega7-1024x143.png\")
\n4. Choose the Main Menu as the menu location, since only Main Menu supports Mega Menu in our theme.<\/p>\n
\n![\"mega8\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega8.png\")
<\/p>\n![\"mega9\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega9-1024x348.png\")
<\/p>\n![\"mega10\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega10-1024x485.png\")
<\/p>\n![\"mega11\"](\"https:\/\/fluentthemes.com\/knowledgebase\/maxhost\/wp-content\/uploads\/2016\/06\/mega11-1024x353.png\")
<\/p>\n