コンテンツへスキップ
メニュー
この質問にフラグが付けられました
2 返信
1580 ビュー

How to add selection in snippet on adding snippet i select 2 different styles for it?

アバター
破棄
最善の回答

Hii,

Create the Snippet Template with Multiple Styles

<odoo> <template id = "my_custom_snippet" name = "My Snippet"> <section class = "s_my_snippet o_snippet" data-snippet = "my_module.my_custom_snippet" data-name = "My Snippet"> <div class = "my-snippet-content style-1"> <h2 >Hello from My Snippet! </h2> </div> </section> </template> </odoo>

  • Default is style-1 . We'll change it using JS.
Register the Snippet in website.snippets

<odoo> <template id = "snippet_options" inherit_id = "website.snippets" name = "My Snippet in Snippets"> <xpath expr = "//div[@id='snippet_structure']" position = "inside"> <t t-call = "website.snippet_template"> <t t-set = "template" t-value = "'my_module.my_custom_snippet'" /> <t t-set = "name" t-value = "'My Custom Snippet'" /> <t t-set = "thumbnail" t-value = "'/my_module/static/description/icon.png'" /> </t> </xpath> </template> </odoo>

Create the JavaScript to Show the Style Selection Popup

/** @odoo -module **/ import { registry } from "@web/core/registry" ; import { SnippetOptionDialog } from "@website/js/editor/snippets/dialogs/snippet_option_dialog" ; const snippetRegistry = registry. category ( "website.snippets" ); snippetRegistry. add ( "my_module.my_custom_snippet" , { async onBuilt ( snippetEl ) { const { confirmed, payload } = await SnippetOptionDialog . open ( "Choose Style" , [ { label : "Style 1" , value : "style-1" }, { label : "Style 2" , value : "style-2" }, ]); if (confirmed) { const contentEl = snippetEl. querySelector ( ".my-snippet-content" ); contentEl. classList . remove ( "style-1" , "style-2" ); contentEl. classList . add ( payload . value ); } }, });

This uses the modern @web module system introduced in Odoo 15+. Works in Odoo 16–18.

4. Add Assets to Manifest


# __manifest__.py { ... "depends" : [ "website" ], "assets" : { "web.assets_frontend" : [ "my_module/static/src/js/snippet_style_picker.js" , ], }, "data" : [ "views/snippets.xml" , "views/snippets_register.xml" , ], }

Optional: Add CSS for Each Style


/* static/src/css/snippet_styles.css */ .my-snippet-content .style-1 { background-color : lightblue; } .my-snippet-content .style-2 { background-color : lightgreen; }

Include it in web.assets_frontend too.

i hope it is use full

アバター
破棄
最善の回答

Hi,


Refer the blog on how to add snippet choice in odoo 16


https://www.cybrosys.com/blog/how-to-add-snippet-choice-in-odoo-16


Hope it helps

アバター
破棄
関連投稿 返信 ビュー 活動
0
8月 24
1090
0
4月 24
836
0
11月 24
1032
1
5月 24
2217
0
4月 22
2245