User Guides

< Back to Article List

Adding an HTML header to an Odoo webpage

Last updated: 20 October 2025 at 11:06:16 UTC by Dom Tyler

Here’s how to add an HTML header (like custom <meta>, <link>, <script>, or even a custom <style>) to an Odoo website page — depending on what exactly you want to change.

🧩 OPTION 1: Add via Website > Customise > HTML/CSS/JS Editor

Best for small edits (like adding a script, style, or meta tag).


  2. Go to your Odoo backend
    → Website app
    → Open the page you want to edit.

  4. Click “Customise” (top right).

  6. Choose HTML/CSS/JS Editor (or “Edit HTML” depending on Odoo version).

  8. In the editor:

    • Expand views/layouts.xml or website.assets_frontend area.

    • Add your code inside the <head> section like this: 
      <t t-extend="website.layout">
  <t t-jquery="head" t-operation="append">
    <meta name="description" content="My custom header text"/>
    <link rel="stylesheet" href="/my_module/static/src/css/custom.css"/>
    <script src="/my_module/static/src/js/custom.js"></script>
  </t>
</t>

  10. Save and reload the page.

⚙️ OPTION 2: Add via Custom Module (cleaner, permanent way)

Best for developers or production systems.

If you’re comfortable editing XML views, create or edit a module that inherits the website layout:

Example:

<odoo>
  <template id="custom_website_header" inherit_id="website.layout">
    <xpath expr="//head" position="inside">
      <meta name="description" content="My custom site description"/>
      <link rel="stylesheet" href="/my_module/static/src/css/custom.css"/>
      <script src="/my_module/static/src/js/custom.js"></script>
    </xpath>
  </template>
</odoo>

Then upgrade the module:

./odoo-bin -u my_module

🪄 OPTION 3: Add per-page HTML (not global)

If you just want something like a banner or custom HTML block at top of page content,

you can use the website editor:


  2. Go to the page

  4. Click Edit

  6. Add a Custom HTML block

  8. Paste your code (e.g. <div class="header-banner">Welcome!</div>)

This adds HTML inside the <body> rather than <head>.