За замовчуванням

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

Мега-меню - це випадаюче меню з додатковими можливостями, а не просто список посилань. У мегаменю можна використовувати будь-який тип контенту (текст, зображення, значки тощо).

В Odoo ви можете вибрати шаблон мега-меню зі списку. Якщо вам не потрібен власний макет, ви можете повторно використовувати структуру шаблону в полі mega_menu_content, як і будь-який статичний контент.

Декларація

/website_airproof/data/menu.xml
 <record id="menu_mega_menu" model="website.menu">
     <field name="name">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">
         <section class="s_mega_menu_multi_menus py-4 o_colored_level o_cc o_cc1">
             <div class="container">
                 <div class="row">
                     <div class="col-12 col-sm py-2 text-center">
                         <h4 class="o_default_snippet_text">First Menu</h4>
                         <nav class="nav flex-column">
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 1</a>
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 2</a>
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 3</a>
                         </nav>
                     </div>
                     <div class="col-12 col-sm py-2 text-center">
                         <h4 class="o_default_snippet_text">Second Menu</h4>
                         <nav class="nav flex-column">
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 1</a>
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 2</a>
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 3</a>
                         </nav>
                     </div>
                     <div class="col-12 col-sm py-2 text-center">
                         <h4 class="o_default_snippet_text">Third Menu</h4>
                         <nav class="nav flex-column">
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 1</a>
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 2</a>
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 3</a>
                         </nav>
                     </div>
                     <div class="col-12 col-sm py-2 text-center">
                         <h4 class="o_default_snippet_text">Last Menu</h4>
                         <nav class="nav flex-column">
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 1</a>
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 2</a>
                             <a href="#" class="nav-link o_default_snippet_text" data-name="Menu Item">Menu Item 3</a>
                         </nav>
                     </div>
                 </div>
             </div>
         </section>
     </field>
 </record>

Поле

Опис

is_mega_menu

Увімкніть функцію мега-меню.

mega_menu_classes

Користувацькі класи, які потрібно додати до основного елемента

mega_menu_content

Стандартний вміст мега-меню

Крім того, вам може знадобитися створити щось візуально складніше за допомогою власного шаблону. Сміливо перевіряйте, як стандартні шаблони вбудовані у вихідний код Odoo.

Користувацький шаблон

Створіть власний шаблон і додайте його до списку.

Макет

/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>

Параметр

Використайте наступний код, щоб додати опцію для вашого нового власного мегаменю у Конструкторі веб-сайтів.

/website_airproof/views/snippets/options.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_airproof.s_mega_menu_airproof"
            data-img="/website_airproof/static/src/img/builder/header_opt.svg"
            t-out="_label"/>
    </xpath>
</template>