コンテンツへスキップ
Odoo メニュー
  • サインイン
  • 無料で15日試す
  • アプリ
    財務
    • 会計
    • 請求
    • 経費
    • スプレッドシート(BI)
    • ドキュメント管理
    • 署名
    販売
    • CRM
    • 販売
    • POS店舗
    • POSレストラン
    • サブスクリプション
    • レンタル
    ウェブサイト
    • ウェブサイトビルダー
    • eコマース
    • ブログ
    • フォーラム
    • ライブチャット
    • eラーニング
    サプライチェーン
    • 在庫
    • 製造
    • 製品ライフサイクル管理 (PLM)
    • 購買
    • 整備
    • 品質
    人事業務
    • 従業員管理
    • 採用
    • 休暇管理
    • 人事評価
    • リファラル
    • フリート
    マーケティング
    • ソーシャルマーケティング
    • メールマーケティング
    • SMSマーケティング
    • イベント
    • マーケティングオートメーション
    • アンケート調査
    サービス
    • プロジェクト管理
    • タイムシート
    • フィールドサービス
    • ヘルプデスク
    • 計画
    • アポイントメント
    生産性向上ツール
    • ディスカッション
    • 承認
    • IoT
    • VoIP
    • ナレッジ
    • WhatsApp
    サードパーティアプリ Odooスタジオ Odooクラウドプラットホーム
  • インダストリー(業種別ソリューション)
    小売
    • 書店
    • アパレルショップ
    • 家具専門店
    • 食料品店
    • 金物店
    • 玩具店
    飲食・ホスピタリティ業界
    • バー・パブ
    • レストラン
    • ファストフード
    • ゲストハウス
    • 飲料販売代理店
    • ホテル
    不動産
    • 不動産会社
    • 建築事務所
    • 建設
    • 不動産管理
    • 造園
    • 住宅所有者組合
    コンサルティング
    • 会計事務所
    • Odooパートナー
    • マーケティングエージェンシー
    • 法律事務所
    • 人材派遣
    • 監査・認証
    製造
    • テキスタイル
    • 金属
    • 家具
    • 飲食
    • 醸造所
    • コーポレートギフト
    ヘルス & フィットネス
    • スポーツクラブ
    • 眼鏡店
    • フィットネスセンター
    • ウェルネス専門家
    • 薬局
    • ヘアサロン
    業種
    • 便利屋
    • IT ハードウェア・サポート
    • 太陽エネルギーシステム
    • 靴メーカー
    • クリーニングサービス
    • 空調設備サービス
    その他
    • 非営利団体
    • 環境機関
    • ビルボードレンタル
    • 写真
    • 自転車リース
    • ソフトウェアリセラー
    すべての業種を見る
  • コミュニティ
    学ぶ
    • チュートリアル
    • ドキュメンテーション
    • 認定
    • トレーニング
    • ブログ
    • ポッドキャスト
    教育サポート
    • 教育プログラム
    • Scale Up! ビジネスゲーム
    • Odooオフィス訪問
    ソフトを入手
    • ダウンロード
    • エディションを比較
    • リリース
    コラボレーション
    • Github
    • フォーラム
    • イベント
    • 翻訳
    • パートナーになる
    • パートナー様向けサービス
    • 会計事務所を登録
    サービス利用
    • パートナー一覧
    • 会計事務所一覧
    • 今すぐ相談する
    • 導入支援サービス
    • お客様一覧
    • サポート
    • アップグレード
    Github Youtube Twitter Linkedin Instagram Facebook Spotify
    +1 (650) 691-3277
    製品デモを利用する
  • 料金
  • ヘルプ

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

  • CRM
  • e-Commerce
  • 会計
  • 在庫
  • PoS
  • プロジェクト
  • MRP
All apps
コミュニティで交流するには登録する必要があります。
全てのポスト 人々 バッジ
タグ (全て表示)
odoo accounting v14 pos v15
このフォーラムについて
コミュニティで交流するには登録する必要があります。
全てのポスト 人々 バッジ
タグ (全て表示)
odoo accounting v14 pos v15
このフォーラムについて
ヘルプ

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

購読

この投稿に活動があった際に通知を受け取ります

この質問にフラグが付けられました
pagesseowebsitemodalOdoo 18custom field
2 返信
1799 ビュー
アバター
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
アバター
破棄
アバター
Piyush H
最善の回答

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
アバター
破棄
Gilvanilson Santos
著作者

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!

アバター
D Enterprise
最善の回答

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
アバター
破棄
Gilvanilson Santos
著作者

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!

ディスカッションを楽しんでいますか?読むだけでなく、参加しましょう!

今すぐアカウントを作成して、限定機能を利用したり、素晴らしいコミュニティと交流しましょう!

登録
関連投稿 返信 ビュー 活動
Odoo SEO – How to handle parameterized URLs? Is robots.txt blocking the right move?
seo website
アバター
0
10月 25
1714
Optimize Seo Error - V14 - V15
seo website
アバター
0
3月 23
2767
Paid Website Orders not Automatically Confirmed
ecommerce website Odoo 18
アバター
アバター
アバター
アバター
3
9月 25
2148
'noindex' in meta tags even when robots.txt have been updated
seo website robots.txt
アバター
0
8月 24
2530
Rewriting URL in Odoo 11 ( Odoo Sh)
url seo website
アバター
0
8月 18
4024
コミュニティ
  • チュートリアル
  • ドキュメンテーション
  • フォーラム
オープンソース
  • ダウンロード
  • Github
  • Runbot
  • 翻訳
サービス
  • Odoo.shホスティング
  • サポート
  • アップグレード
  • カスタム開発
  • 教育プログラム
  • 会計事務所一覧
  • パートナー一覧
  • パートナーになる
企業情報
  • 会社概要
  • ブランドアセット
  • お問い合わせ
  • 採用情報
  • イベント
  • ポッドキャスト
  • ブログ
  • お客様一覧
  • リーガル情報 • プライバシーポリシー
  • セキュリティ
الْعَرَبيّة 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(オドゥー)は、CRM、eコマース、会計、在庫管理、POS、プロジェクト管理など、企業のさまざまな業務を一つのシステムで管理できる、ベルギー発のオープンソースのERPソフトウェアです。

高機能で使いやすく、完全に統合されたERPとして、ユニークな価値を提供しています。

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