Default

Odoo automatically generates some basic menu items depending on the apps you installed. For example, the Website app adds two items to the main menu. These items are linked to pages, which are also automatically created.

Delete default menu items.

/website_airproof/data/menu.xml
<!-- Contact us -->
<delete model="website.menu" search="[('url','in', ['/', '/contactus']),
('website_id', '=', 1)]"/>

<!-- Shop -->
<delete model="website.menu" search="[('url','in', ['/', '/shop']),
('website_id', '=', 1)]"/>

New window

Open the link’s URL in a new tab.

<record id="..." model="website.menu">
    <field name="new_window" eval="True"/>
</record>

Anchor

Link to a specific section of a page.

<record id="..." model="website.menu">
    <field name="url">/about-us#our-team</field>
</record>

Mega menu

A mega menu is a dropdown menu with additional possibilities and not just a list of links. In a mega menu, you can use any kind of content (text, images, icons, …).

Declaration

/website_airproof/data/menu.xml
<record id="menu_mega_menu" model="website.menu">
    <field name="name">Mega Menu</field>
    <field name="url">/mega-menu</field>
    <field name="parent_id" search="[
        ('url', '=', '/default-main-menu'),
        ('website_id', '=', 1)]"/>
    <field name="website_id">1</field>
    <field name="sequence" type="int">..</field>
    <field name="is_mega_menu" eval="True"/>
    <field name="mega_menu_classes">...</field>
    <field name="mega_menu_content" type="html">
        <!-- Content -->
    </field>
</record>

Field

Description

is_mega_menu

Enable the mega menu feature.

mega_menu_classes

Custom classes to be added to the main element

mega_menu_content

The default content of the mega menu

Custom template

Create your own template and add it to the list.

Layout

/website_airproof/views/website_templates.xml
<template id="s_mega_menu_airproof" name="Airproof" groups="base.group_user">
    <section class="s_mega_menu_airproof o_cc o_cc1 pt40">
        <!-- Content -->
    </section>
</template>

Option

Use the following code to add an option for your new custom mega menu on the Website Builder.

/website_airproof/data/presets.xml
<template id="snippet_options" inherit_id="website.snippet_options" name="Airproof - Mega Menu Options">
    <xpath expr="//*[@data-name='mega_menu_template_opt']/*" position="before">
        <t t-set="_label">Airproof</t>
        <we-button t-att-data-select-label="_label"
            data-select-template="website_website_airproof.s_mega_menu_airproof"
            data-img="/website_airproof/static/src/img/builder/header_opt.svg"
            t-out="_label"/>
    </xpath>
</template>