Skip to Content
Odoo Menú
  • Registra entrada
  • Prova-ho gratis
  • Aplicacions
    Finances
    • Comptabilitat
    • Facturació
    • Despeses
    • Full de càlcul (IA)
    • Documents
    • Signatura
    Vendes
    • CRM
    • Vendes
    • Punt de venda per a botigues
    • Punt de venda per a restaurants
    • Subscripcions
    • Lloguer
    Imatges de llocs web
    • Creació de llocs web
    • Comerç electrònic
    • Blog
    • Fòrum
    • Xat en directe
    • Aprenentatge en línia
    Cadena de subministrament
    • Inventari
    • Fabricació
    • PLM
    • Compres
    • Manteniment
    • Qualitat
    Recursos humans
    • Empleats
    • Reclutament
    • Absències
    • Avaluacions
    • Recomanacions
    • Flota
    Màrqueting
    • Màrqueting Social
    • Màrqueting per correu electrònic
    • Màrqueting per SMS
    • Esdeveniments
    • Automatització del màrqueting
    • Enquestes
    Serveis
    • Projectes
    • Fulls d'hores
    • Servei de camp
    • Suport
    • Planificació
    • Cites
    Productivitat
    • Converses
    • Validacions
    • IoT
    • VoIP
    • Coneixements
    • WhatsApp
    Aplicacions de tercers Odoo Studio Plataforma d'Odoo al núvol
  • Sectors
    Comerç al detall
    • Llibreria
    • Botiga de roba
    • Botiga de mobles
    • Botiga d'ultramarins
    • Ferreteria
    • Botiga de joguines
    Food & Hospitality
    • Bar i pub
    • Restaurant
    • Menjar ràpid
    • Guest House
    • Distribuïdor de begudes
    • Hotel
    Immobiliari
    • Agència immobiliària
    • Estudi d'arquitectura
    • Construcció
    • Gestió immobiliària
    • Jardineria
    • Associació de propietaris de béns immobles
    Consultoria
    • Empresa comptable
    • Partner d'Odoo
    • Agència de màrqueting
    • Bufet d'advocats
    • Captació de talent
    • Auditoria i certificació
    Fabricació
    • Textile
    • Metal
    • Mobles
    • Menjar
    • Brewery
    • Regals corporatius
    Salut i fitness
    • Club d'esport
    • Òptica
    • Centre de fitness
    • Especialistes en benestar
    • Farmàcia
    • Perruqueria
    Trades
    • Servei de manteniment
    • Hardware i suport informàtic
    • Sistemes d'energia solar
    • Shoe Maker
    • Serveis de neteja
    • Instal·lacions HVAC
    Altres
    • Nonprofit Organization
    • Agència del medi ambient
    • Lloguer de panells publicitaris
    • Fotografia
    • Lloguer de bicicletes
    • Distribuïdors de programari
    Browse all Industries
  • Comunitat
    Aprèn
    • Tutorials
    • Documentació
    • Certificacions
    • Formació
    • Blog
    • Pòdcast
    Potenciar l'educació
    • Programa educatiu
    • Scale-Up! El joc empresarial
    • Visita Odoo
    Obtindre el programari
    • Descarregar
    • Comparar edicions
    • Novetats de les versions
    Col·laborar
    • GitHub
    • Fòrum
    • Esdeveniments
    • Traduccions
    • Converteix-te en partner
    • Services for Partners
    • Registra la teva empresa comptable
    Obtindre els serveis
    • Troba un partner
    • Troba un comptable
    • Contacta amb un expert
    • Serveis d'implementació
    • Referències del client
    • Suport
    • Actualitzacions
    Github Youtube Twitter Linkedin Instagram Facebook Spotify
    +1 (650) 691-3277
    Programar una demo
  • Preus
  • Ajuda

Odoo is the world's easiest all-in-one management software.
It includes hundreds of business apps:

  • CRM
  • e-Commerce
  • Comptabilitat
  • Inventari
  • PoS
  • Projectes
  • MRP
All apps
You need to be registered to interact with the community.
All Posts People Badges
Etiquetes (View all)
odoo accounting v14 pos v15
About this forum
You need to be registered to interact with the community.
All Posts People Badges
Etiquetes (View all)
odoo accounting v14 pos v15
About this forum
Ajuda

How to Add a Custom Field to the SEO Modal Form in Website Pages (Odoo 18)

Subscriure's

Get notified when there's activity on this post

This question has been flagged
pagesseowebsitemodalOdoo 18custom field
2 Respostes
1812 Vistes
Avatar
Gilvanilson Santos

Hi everyone,


I'm working on Odoo 18 and trying to add a custom field to the SEO modal popup that appears when editing a page on the website (the “Website > Optimize SEO” dialog). I want to include a field called webpage_schema_type to let users pick the Schema.org type for the current page (like WebPage, ContactPage, etc.).


I managed to create the field on the model and make it available, but I can't figure out how to inject it into the modal form UI. The modal is built using OWL components, and I couldn't find an easy way to extend or patch it.


Here’s what I tried:


1. Field on the model:


from odoo import models, fields


class WebsitePage(models.Model):

    _inherit = 'website.page'


    webpage_schema_type = fields.Selection([

        ('WebPage', 'WebPage'),

        ('AboutPage', 'About Page'),

        ('CheckoutPage', 'Checkout Page'),

        ('CollectionPage', 'Collection Page'),

        ('ContactPage', 'Contact Page'),

        ('FAQPage', 'FAQ Page'),

        ('ProfilePage', 'Profile Page'),

        ('SearchResultsPage', 'Search Results Page'),

    ], string="WebPage Schema Markup", default="WebPage", help="Select Schema Markup for your page. Search engines use structured data to display rich results in SERPs. For more information, visit https://schema.org/WebPage")



2. Trying to patch the modal component (JS):


// In website.assets_editor


/** @odoo-module **/

import { patch } from "@web/core/utils/patch";

import { SeoDialog } from "@website/js/components/dialog/seo";


patch(SeoDialog.prototype, {

    setup() {

        this._super(...arguments);

        this.state.webpage_schema_type = this.props.values.webpage_schema_type || "";

    },

});


But nothing appears in the modal.




What I need:


  • How to properly extend or patch the SEO modal form to show and save my custom field?
  • Do I need to replace the whole component, or is there a cleaner way to inject just one new field?


Any help or example would be appreciated 🙏. I'm open to OWL/JS code if needed. Thanks in advance!

0
Avatar
Descartar
Avatar
Piyush H
Best Answer

Dear Gilvanilson,

To properly add your webpage_schema_type field to the SEO dialog, you'll need to modify both the Python model and the OWL component. Here's a complete solution:

1. First, ensure your model extension is correct (Python)

python

from odoo import models, fields

class WebsitePage(models.Model):
    _inherit = 'website.page'

    webpage_schema_type = fields.Selection(
        selection=[
            ('WebPage', 'WebPage'),
            ('AboutPage', 'About Page'),
            ('CheckoutPage', 'Checkout Page'),
            ('CollectionPage', 'Collection Page'),
            ('ContactPage', 'Contact Page'),
            ('FAQPage', 'FAQ Page'),
            ('ProfilePage', 'Profile Page'),
            ('SearchResultsPage', 'Search Results Page'),
        ],
        string="Schema.org Type",
        default="WebPage",
        help="Select Schema Markup type for structured data"
    )
2. Create a JS module to extend the SEO dialog

Create a new file in your module: static/src/js/seo_dialog_extension.js

javascript

/** @odoo-module **/

import { patch } from "@web/core/utils/patch";
import { SeoDialog } from "@website/js/components/dialog/seo";

patch(SeoDialog.prototype, {
    setup() {
        super.setup();
        this.schemaOptions = [
            { value: 'WebPage', label: 'WebPage' },
            { value: 'AboutPage', label: 'About Page' },
            { value: 'CheckoutPage', label: 'Checkout Page' },
            { value: 'CollectionPage', label: 'Collection Page' },
            { value: 'ContactPage', label: 'Contact Page' },
            { value: 'FAQPage', label: 'FAQ Page' },
            { value: 'ProfilePage', label: 'Profile Page' },
            { value: 'SearchResultsPage', label: 'Search Results Page' },
        ];
    },

    /**
     * @override
     */
    async willStart() {
        const res = await super.willStart(...arguments);
        this.state.webpage_schema_type = this.initialValues.webpage_schema_type || 'WebPage';
        return res;
    },

    /**
     * @override
     */
    _prepareSEOPayload() {
        const payload = super._prepareSEOPayload();
        payload.webpage_schema_type = this.state.webpage_schema_type;
        return payload;
    },
});

// Add the field to the template
SeoDialog.template = 'your_module.SeoDialogExtended';
3. Create an XML template extension

Add to your module's views: views/seo_dialog_extension.xml

xml

<template id="SeoDialogExtended" inherit_id="website.SeoDialog" name="SEO Dialog Extended">
    <xpath expr="//div[hasclass('o_seo_configuration')]" position="before">
        <div class="form-group">
            <label class="col-form-label">Schema.org Type</label>
            <select t-att-name="'webpage_schema_type'" class="form-select" t-att-value="state.webpage_schema_type">
                <t t-foreach="schemaOptions" t-as="option">
                    <option t-att-value="option.value" t-esc="option.label"/>
                </t>
            </select>
        </div>
    </xpath>
</template>
4. Update your module assets

Add to your module's manifest (__manifest__.py):

python

'assets': {
    'web.assets_frontend': [
        'your_module/static/src/js/seo_dialog_extension.js',
    ],
    'web.assets_qweb': [
        'your_module/views/seo_dialog_extension.xml',
    ],
},
5. Update the website controller (optional)

To make the field available in the editor:

python

class Website(models.Model):
    _inherit = 'website'

    def _prepare_website_page_values(self, page):
        values = super()._prepare_website_page_values(page)
        values['webpage_schema_type'] = page.webpage_schema_type
        return values
Key Points:
  1. The patch modifies the original SeoDialog component to:
    • Add your schema options
    • Include the field in the state
    • Ensure it's saved with the SEO data
  2. The template inheritance adds your field to the existing dialog layout
  3. The manifest updates ensure your JS and XML are properly loaded
  4. This approach doesn't replace the whole component, just extends it cleanly

After implementing this, your field should appear in the SEO dialog and be properly saved with the page data. The value will be available on the website.page model for use in your templates or other business logic.

🚀 Did This Solve Your Problem?

If this answer helped you save time, money, or frustration, consider:

✅ Upvoting (👍) to help others find it faster

✅ Marking as "Best Answer" if it resolved your issue

Your feedback keeps the Odoo community strong! 💪

(Need further customization? Drop a comment—I’m happy to refine the solution!)

1
Avatar
Descartar
Gilvanilson Santos
Autor

Hi Piyush,

Thanks a lot for taking the time to share this solution with us. It’s very helpful! We’re going to test the implementation and will let you know how it goes. Really appreciate your help!

Avatar
D Enterprise
Best Answer

Hii,

Ensure your field is present on the model
You already did this — great.
# models/website_page.py

from odoo import models, fields


class WebsitePage(models.Model):

    _inherit = 'website.page'


    webpage_schema_type = fields.Selection([

        ('WebPage', 'WebPage'),

        ('AboutPage', 'About Page'),

        ('CheckoutPage', 'Checkout Page'),

        ('CollectionPage', 'Collection Page'),

        ('ContactPage', 'Contact Page'),

        ('FAQPage', 'FAQ Page'),

        ('ProfilePage', 'Profile Page'),

        ('SearchResultsPage', 'Search Results Page'),

    ], string="WebPage Schema Markup", default="WebPage")

Patch the SeoDialog and its template

  • You need to patch both:
    • setup() to handle the state.
    • template to render the field in the modal.

/** @odoo-module **/


import { patch } from "@web/core/utils/patch";

import { SeoDialog } from "@website/js/components/dialog/seo";

import { xml } from "@odoo/owl";


patch(SeoDialog.prototype, {

    setup() {

        super.setup(...arguments);

        this.state.webpage_schema_type = this.props.values.webpage_schema_type || "WebPage";

    },


    getAdditionalFields() {

        return xml`

            <div class="form-group">

                <label>WebPage Schema Markup</label>

                <select t-model="state.webpage_schema_type" class="form-control">

                    <option value="WebPage">WebPage</option>

                    <option value="AboutPage">About Page</option>

                    <option value="CheckoutPage">Checkout Page</option>

                    <option value="CollectionPage">Collection Page</option>

                    <option value="ContactPage">Contact Page</option>

                    <option value="FAQPage">FAQ Page</option>

                    <option value="ProfilePage">Profile Page</option>

                    <option value="SearchResultsPage">Search Results Page</option>

                </select>

            </div>

        `;

    },


    _getValues() {

        return {

            ...super._getValues(),

            webpage_schema_type: this.state.webpage_schema_type,

        };

    },

});

Patch the template

You must ensure the patched field is actually rendered. Inside your JS module:
patch(SeoDialog, {

    components: SeoDialog.components,

    template: xml`

        <div>

            <t t-call="website.SeoDialog.main">

                <!-- your custom field injected below -->

                <t t-raw="this.getAdditionalFields()" />

            </t>

        </div>

    `,

});


0
Avatar
Descartar
Gilvanilson Santos
Autor

Hi Desk,

Thanks for the advice! It’s good to know we’re on the right track with the model. We’ll test the implementation and get back to you with feedback. Thanks again for your help!

Enjoying the discussion? Don't just read, join in!

Create an account today to enjoy exclusive features and engage with our awesome community!

Registrar-se
Related Posts Respostes Vistes Activitat
Odoo SEO – How to handle parameterized URLs? Is robots.txt blocking the right move?
seo website
Avatar
0
d’oct. 25
1719
Optimize Seo Error - V14 - V15
seo website
Avatar
0
de març 23
2768
Paid Website Orders not Automatically Confirmed
ecommerce website Odoo 18
Avatar
Avatar
Avatar
Avatar
3
de set. 25
2152
'noindex' in meta tags even when robots.txt have been updated
seo website robots.txt
Avatar
0
d’ag. 24
2537
Rewriting URL in Odoo 11 ( Odoo Sh)
url seo website
Avatar
0
d’ag. 18
4026
Community
  • Tutorials
  • Documentació
  • Fòrum
Codi obert
  • Descarregar
  • GitHub
  • Runbot
  • Traduccions
Serveis
  • Allotjament a Odoo.sh
  • Suport
  • Actualització
  • Desenvolupaments personalitzats
  • Educació
  • Troba un comptable
  • Troba un partner
  • Converteix-te en partner
Sobre nosaltres
  • La nostra empresa
  • Actius de marca
  • Contacta amb nosaltres
  • Llocs de treball
  • Esdeveniments
  • Pòdcast
  • Blog
  • Clients
  • Informació legal • Privacitat
  • Seguretat
الْعَرَبيّة Català 简体中文 繁體中文 (台灣) Čeština Dansk Nederlands English Suomi Français Deutsch हिंदी Bahasa Indonesia Italiano 日本語 한국어 (KR) Lietuvių kalba Język polski Português (BR) română русский язык Slovenský jazyk slovenščina Español (América Latina) Español ภาษาไทย Türkçe українська Tiếng Việt

Odoo és un conjunt d'aplicacions empresarials de codi obert que cobreix totes les necessitats de la teva empresa: CRM, comerç electrònic, comptabilitat, inventari, punt de venda, gestió de projectes, etc.

La proposta única de valor d'Odoo és ser molt fàcil d'utilitzar i estar totalment integrat, ambdues alhora.

Website made with

Odoo Experience on YouTube

1. Use the live chat to ask your questions.
2. The operator answers within a few minutes.

Live support on Youtube
Watch now