Skip to content

# Creating Megamenus

## Building Megamenu Dropdown

Vodi supports Megamenu Dropdown, with the help of plugins that comes bundled with the theme namely : MAS Static Content plugin.

### 1. Static Content Post Type

A megamenu item in Vodi theme is a Static Content This Static Content is available on activating MAS Static Content Plugin.

### 2. Add a new megamenu item

1. Navigate to Static Content > Add New.
2. Give it a title, lets say “Pages Megamenu” item. The title is not used anywhere in displaying the menu.
3. Click on Add block. It will display Gutenberg blocks choose the coumns and add the Custom Html block inside the coulms.
4. Let us add a simple text block. Click on Add text block button and the result will look like this.
5. Columns counts are configure right settings.
6. Click on Publish button.

### 3. Adding megamenu item as a submenu to a menu item

1. Navigate to Appearance > Menus.
2. On top right corner of your screen, you will find a dropdown menu Screen Options. Click on it.
3. In the dropdown that appears, check on Static Content Blocks under Show on screen. You will now see Static Content Blocks listed in the left side.

1. Choose the menu you want to edit. In my case I’ve chose a menu that is hooked to Primary Menu (Header v1) location.
2. Now check the Pages Megamenu item and click on Add to menu.
3. Drag the Pages Megamenu box and drop it under any existing menu as a submenu.
4. Click on Save Menu.
5. Now the megamenu will is added as a submenu.

### 4. A complex Megamenu Item

We built our simple Megamenu in previous section. We are now going to build a little complex mega menu using Gutenberg.

### 1. The Grid

- Our Complex Megamenu item will now have 2 columns.
- First Column is custom html and second column is TV Show Carousel Block.

### TV Show Megamenu﻿

Settings

TV Show Carousel Block Settings

TV Show Carousel Block Output

### Movies Megamenu

Settings

Movie Block Settings

Movies Carousel Settings

Output

### Pages Megamenu

Settings

Output

###### Contents

- Welcome
- Getting Started
  - Introduction
  - Download & Installation
  - Demo Content
    - One Click Demo Import (Recommended)
    - Manual Import
  - Updating the theme
- Set Up Pages
  - Home v1
    - Home v1 via Gutenberg
  - Home v2
    - Home v2 via Gutenberg
  - Home v3
    - Home v3 via Gutenberg
  - Home v4
    - Home v4 via Gutenberg
  - Home v5
    - Home v5 via Gutenberg
  - Home v6
    - Home v6 via Gutenberg
  - Home v7
    - Home v7 via Gutenberg
  - Home v8
    - Home v8 via Gutenberg
  - Home v9
    - Home v9 via Gutenberg
  - Landing v1
    - Landing v1 via Gutenberg
  - Landing v2
    - Landing v2 via Gutenberg
  - Contact
    - Contact via Gutenberg
  - Coming soon
    - Coming soon via Gutenberg
- Blocks & Sidebars
  - Header
  - Sidebars
  - Footer
- Set Up Movie
  - Adding and Managing Movies
  - Managing Movie Genres, Tags and Attributes
  - Manage Movie Playlists
  - Movie CSV Importer
- Set Up TV Shows
  - Adding and Managing TV Shows
  - Managing TV Show Genres, Tags and Attributes
  - Manage TV Show Playlists
  - TV Show CSV Importer
- Set Up Videos
  - Adding and Managing Videos
  - Managing Video Categories, Tags and Attributes
  - Manage Video Playlists
  - Video CSV Importer
- Theme Options
  - Header
  - Footer
  - Blog
  - Movies
  - TV Shows
  - Videos
- Gutenberg Blocks
  - Active Videos
  - Movie Section Aside Header
  - Videos Slider
  - TV Shows Slider
  - Movies Slider
  - Videos Carousel Aside Header
  - Movies Carousel Nav Header
  - Slider Movies
  - section Hot Premier Block
  - Section videos live coming soon
  - Video Section Block
  - Videos with Featured Video
  - Featured Video Section
  - Comingsoon Launch Section
  - Movies List
  - Single Featured movie
  - Blog List Section
  - Blog Grid Section
  - Blog Tab Section
  - Blog Grid with List Section
  - Movies Carousel Flex Header
  - Section Movies Carousel Aside Header
  - Recent Comments
  - Videos Carousel Flex Header Block
  - Event Category List
  - Banner With Section Videos
  - Landing Hero banner
  - Landing Featured Section
  - Landing Movies Carousel Block
  - Landing Tabs Features
  - Landing Featured Video Section
  - Landing Features Section
  - Landing Faq Section
  - Episodes with Featured Episode
  - TV Show Section Block
  - Landing Viewcounts Section
  - Featured Movies Carousel
  - Featured Movie Block
  - TV Episode Carousel Flex Header Block
  - Featured TV Show Block
  - TV Shows Aside Header Block
  - TV Episodes Carousel Aside Header Block
  - Full-width Banner Block
  - Banner With TV Shows Block
  - Videos Carousel Nav Header Block
  - Featured Post Block
  - Vodi Section Playlist Carousel
- Navigation
  - General Guidelines
  - Menus & Locations
  - Creating Megamenus