<h1 class="title">Website Menu Icons</h1> <p><a class="reference external" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external" href="https://github.com/OCA/website/tree/13.0/website_menu_icon"><img alt="OCA/website" src="https://img.shields.io/badge/github-OCA%2Fwebsite-lightgray.png?logo=github" /></a> <a class="reference external" href="https://translation.odoo-community.org/projects/website-13-0/website-13-0-website_menu_icon"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external" href="https://runbot.odoo-community.org/runbot/186/13.0"><img alt="Try me on Runbot" src="https://img.shields.io/badge/runbot-Try%20me-875A7B.png" /></a></p> <p>This module allows to assign image or icon to individual menu entries. These can be used in a custom theme to render menus with icons. The module also brings back option for opening menu item in new window</p> <p><strong>Table of contents</strong></p> <div class="contents local topic" id="contents"> <ul class="simple"> <li><a class="reference internal" href="#configuration" id="id1">Configuration</a></li> <li><a class="reference internal" href="#bug-tracker" id="id2">Bug Tracker</a></li> <li><a class="reference internal" href="#credits" id="id3">Credits</a><ul> <li><a class="reference internal" href="#authors" id="id4">Authors</a></li> <li><a class="reference internal" href="#contributors" id="id5">Contributors</a></li> <li><a class="reference internal" href="#maintainers" id="id6">Maintainers</a></li> </ul> </li> </ul> </div> <a name="configuration"></a> <h2><a class="toc-backref" href="#id1">Configuration</a></h2> <p>Go to each <cite>Website</cite>, click <cite>Edit</cite> and click on menu item. The confirmation will ask you to choose whether to go to that link or edit the menu. If you select <cite>Edit the menu</cite> the enhanced menu editor will appear.</p> <img alt="https://raw.githubusercontent.com/Rad0van/website/website_menu_icon/website_menu_icon/static/description/edit_menu.png" src="https://raw.githubusercontent.com/Rad0van/website/website_menu_icon/website_menu_icon/static/description/edit_menu.png" /> <p>For each menu item it shows preview of icon/image (if any was selected). It also adds badge to those items that are to be opened in new window.</p> <p>If you click the <cite>Edit Menu Item</cite> button enhanced menu item editing dialog.</p> <img alt="https://raw.githubusercontent.com/Rad0van/website/website_menu_icon/website_menu_icon/static/description/edit_item.png" src="https://raw.githubusercontent.com/Rad0van/website/website_menu_icon/website_menu_icon/static/description/edit_item.png" /> <p>Clicking on search icon will bring up <cite>Select a Media</cite> dialog that will allow for selecting either image or font awesome icon.</p> <p>The module itself does not alter rendering of the website menu. This can be achieved be extending menu rendering in your theme. Something like this:</p> <pre> <code lang="XML">&lt;template id=&quot;submenu&quot; inherit_id=&quot;website.submenu&quot;&gt; &lt;!-- append glyphicons --&gt; &lt;xpath expr=&quot;//li/a&quot; position=&quot;attributes&quot;&gt; &lt;attribute name=&quot;t-attf-class&quot; add=&quot;text-alpha&quot; separator=&quot; &quot;/&gt; &lt;/xpath&gt; &lt;xpath expr=&quot;//li/a/span[&#64;t-field='submenu.name']&quot; position=&quot;before&quot;&gt; &lt;t t-if=&quot;submenu.image_type == 'icon'&quot;&gt; &lt;span t-if=&quot;submenu.image&quot; t-attf-class=&quot;menu-icon #{submenu.image or ''}&quot;/&gt; &lt;/t&gt; &lt;t t-elif=&quot;submenu.image_type == 'image'&quot;&gt; &lt;img class=&quot;menu-image o_we_custom_image&quot; t-att-src=&quot;submenu.image&quot;/&gt; &lt;/t&gt; &lt;t t-else=&quot;&quot;&gt; &lt;/t&gt; &lt;/xpath&gt; &lt;/template&gt;</code> </pre> <a name="bug-tracker"></a> <h2><a class="toc-backref" href="#id2">Bug Tracker</a></h2> <p>Bugs are tracked on <a class="reference external" href="https://github.com/OCA/website/issues">GitHub Issues</a>. In case of trouble, please check there if your issue has already been reported. If you spotted it first, help us smashing it by providing a detailed and welcomed <a class="reference external" href="https://github.com/OCA/website/issues/new?body=module:%20website_menu_icon%0Aversion:%2013.0%0A%0A**Steps%20to%20reproduce**%0A-%20...%0A%0A**Current%20behavior**%0A%0A**Expected%20behavior**">feedback</a>.</p> <p>Do not contact contributors directly about support or help with technical issues.</p> <a name="credits"></a> <h2><a class="toc-backref" href="#id3">Credits</a></h2> <a name="authors"></a> <h3><a class="toc-backref" href="#id4">Authors</a></h3> <ul class="simple"> <li>Radovan Skolnik</li> </ul> <a name="contributors"></a> <h3><a class="toc-backref" href="#id5">Contributors</a></h3> <ul class="simple"> <li>Radovan Skolnik &lt;<a class="reference external" href="mailto:radovan&#64;skolnik.info">radovan&#64;skolnik.info</a>&gt;</li> </ul> <a name="maintainers"></a> <h3><a class="toc-backref" href="#id6">Maintainers</a></h3> <p>This module is maintained by the OCA.</p> <a class="reference external image-reference" href="https://odoo-community.org"><img alt="Odoo Community Association" src="https://odoo-community.org/logo.png" /></a> <p>OCA, or the Odoo Community Association, is a nonprofit organization whose mission is to support the collaborative development of Odoo features and promote its widespread use.</p> <p>This module is part of the <a class="reference external" href="https://github.com/OCA/website/tree/13.0/website_menu_icon">OCA/website</a> project on GitHub.</p> <p>You are welcome to contribute. To learn how please visit <a class="reference external" href="https://odoo-community.org/page/Contribute">https://odoo-community.org/page/Contribute</a>.</p>