پیش‌فرض

Odoo به‌طور خودکار برخی آیتم‌های منوی پایه را بسته به اپلیکیشن‌های نصب‌شده تولید می‌کند. برای مثال، اپلیکیشن وب‌سایت دو آیتم به منوی اصلی اضافه می‌کند. این آیتم‌ها به صفحاتی پیوند داده می‌شوند که آن‌ها نیز به‌طور خودکار ایجاد می‌شوند.

آیتم‌های منوی پیش‌فرض را حذف کنید.

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

پنجرهٔ جدید

URL لینک را در یک زبانهٔ جدید باز کن.

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

لنگر

لینک به یک بخش خاص از یک صفحه.

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

Mega menu

Mega menu یک منوی dropdown با امکانات بیشتر است و فقط یک فهرست از لینک‌ها نیست. در یک mega menu، می‌توانید هر نوع محتوایی (متن، تصویر، آیکون و ...) استفاده کنید.

در Odoo، می‌توانید یک قالب mega-menu را در فهرست انتخاب کنید. اگر به یک چیدمان سفارشی نیاز ندارید، می‌توانید ساختار قالب را در فیلد 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', '=', '#'),
      ('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 را فعال کنید.

mega_menu_classes

کلاس‌های سفارشی که باید به عنصر اصلی اضافه شوند

mega_menu_content

محتوای پیش‌فرض mega menu

علاوه بر آن، ممکن است نیاز داشته باشید چیزی از نظر بصری پیشرفته‌تر با یک قالب سفارشی ایجاد کنید. در صورت تمایل بررسی کنید چگونه قالب‌های استاندارد در کد منبع 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>

گزینه

از کد زیر برای افزودن یک گزینه برای mega menu سفارشی جدید خود در ابزار ساخت وب‌سایت استفاده کنید.

/website_airproof/static/src/website_builder/mega_menu_option.xml
<?xml version="1.0" encoding="UTF-8" ?>
<templates xml:space="preserve">
   <t t-name="website_airproof.MegaMenuOption" t-inherit="website.MegaMenuOption" t-inherit-mode="extension">
      <xpath expr="//BuilderSelect[@id=&quot;'mega_menu_template_opt'&quot;]" position="inside">
         <BuilderSelectItem
            title.translate="Airproof"
            actionParam="{
               view: `website_airproof.s_mega_menu_airproof`,
               templateClass: 's_mega_menu_airproof',
            }">
            <Img class="'w-75 mx-auto my-3'" src="'/website_airproof/static/src/img/wbuilder/template-header-opt.svg'" />
         </BuilderSelectItem>
      </xpath>
   </t>
</templates>