O'Reilly logo

Odoo Development Cookbook by Daniel Reis, Alexandre Fayolle, Holger Brunn

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Extending CSS and JavaScript for the website

In this recipe, we'll see how to add custom style sheets and JavaScript to the website.

Getting ready

Create an empty module named ch13_r01 and install it in your test database. Make sure this module depends on the website module, as we use some of its functionality.

How to do it...

Override the main website template to inject your code:

  1. Add a file called views/templates.xml and add an empty view override:
    <odoo>
        <template id="assets_frontend" inherit_id="website.assets_frontend">
            <xpath expr="." position="inside">
                <!-- points 2 & 3 go here /-->
            </xpath>
        </template>
    </odoo>
  2. Add a reference to your CSS file:
    <link href="/ch13_r01/static/src/css/ch13_r01.css" rel="stylesheet" type="text/css"/>
  3. Add a reference ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required