Odoo – format topbar

If you are using Odoo V15 and want to change the background color of the topbar, then this code snippet will help you.

1. Navigate to Views

Activate the Odoo developer mode How to activate the Odoo developer mode: Activate developer mode in Odoo to switch to the technical settings via settings.

There go to the item Views and create a new view there.

2. Create new view

Then create the following view, which will override the default. For this view to work, fill in the following fields:

1. View designation – can be chosen freely
2. View Type – QWeb
3. Sequence – 16
4. Derived View – Web layout
5. Derived View. Extension Overview

Then insert the following code, you have to add the brackets “<” & “>” manually after copying.

<data inherit_id="web.layout">
    <xpath expr="//body" position="inside">
        <style>
            .o_main_navbar {background-color: #326D93 !important;border-bottom: 0px;}
            .o_main_navbar .show .dropdown-toggle {background-color: #326D93;}
            .o_main_navbar > ul > li > a:hover, .o_main_navbar 
                   > ul > li > label:hover {background-color: #4a666f;}
            .o_main_navbar > a:hover, .o_main_navbar > a:focus, .o_main_navbar 
                   > button:hover, .o_main_navbar 
                   > button:focus {background-color: #4a666f;color: inherit;}
            .o_main_navbar > a:hover, .o_main_navbar > a:focus, .o_main_navbar 
                   > button:hover, .o_main_navbar 
                   > button:focus {background-color: #4a666f;color: inherit;}   
        </style>
    </xpath>
</data>

The result should look like this:

Dieser Beitrag ist auch verfügbar auf: Deutsch (German)