Skip to Content

Website Snippet Builder

by
Odoo

$ 9.99

v 19.0 Third Party
Availability
Odoo Online
Odoo.sh
On Premise
Odoo Apps Dependencies • Website (website)
• Discuss (mail)
Lines of code 993
Technical Name website_snippet_builder
LicenseLGPL-3
Websitehttps://www.hsxtech.net
You bought this module and need support? Click here!
Availability
Odoo Online
Odoo.sh
On Premise
Odoo Apps Dependencies • Website (website)
• Discuss (mail)
Lines of code 993
Technical Name website_snippet_builder
LicenseLGPL-3
Websitehttps://www.hsxtech.net
HSxTech Logo
🧩 Create custom website snippets from the backend that appear as drag-and-drop blocks.

Website Snippet Builder

Design custom drag-and-drop website blocks directly from the Odoo backend. Add HTML content, custom CSS, and custom JavaScript — your snippets automatically appear in the website editor's Blocks panel ready to use.

Backend Snippet Designer Custom HTML / CSS / JS Drag & Drop Blocks

What this module does

Empowers you to create custom website snippets without writing code in module files. Design snippet HTML content with a code editor, add custom CSS and JavaScript, choose a snippet category, and your blocks instantly appear in the website editor's Blocks panel for drag-and-drop use.

No-Code Design
Create website snippets entirely from the backend using a rich code editor — no module development needed.
Full Customization
Add custom HTML, scoped CSS styling, and JavaScript per snippet with live preview support.
Instant Integration
Snippets automatically register in the website editor and appear in the Blocks panel under your chosen category.

How it works

The module auto-generates QWeb views for each snippet — a template view, a registry view to register the block in the editor, and optional CSS/JS asset views injected into the website layout.

  1. Go to Snippet Builder > Snippets > Custom Snippets and click Create.
  2. Enter a name, select a category (Intro, Content, Columns, Custom, etc.).
  3. Write your snippet HTML content using Bootstrap classes in the code editor.
  4. Optionally add Custom CSS (auto-scoped to your snippet class) and Custom JavaScript.
  5. Click Save — the module auto-generates all required QWeb views.
  6. Open your website, click Edit, and find your snippet in the Blocks panel under the selected category — drag and drop it onto any page.
Note: The module includes 5 ready-to-use sample snippets (Services Cards, Pricing Table, Team Section, Testimonials & Stats, CTA Banner) so you can see it in action immediately after installation.

Screenshots

Snippet Builder List View — Manage All Custom Snippets
Snippet Builder List View
Snippet Form View — Design HTML, CSS, and JavaScript
Snippet Builder Form View
Preview Your Snippet — Design
Snippet Builder Form View
Custom Snippet in Website Editor Blocks Panel
Snippet in Website Editor
Drag-and-Drop Custom Snippet on a Website Page
Snippet on Website Page
HSxTech
HSxTech

Helping businesses work smarter with tailored Odoo solutions. We deliver custom modules, integrations, and workflow improvements designed for your needs.

Email Us WhatsApp
© HSxTech — Odoo & Data Solutions

Please log in to comment on this module

  • The author can leave a single reply to each comment.
  • This section is meant to ask simple questions or leave a rating. Every report of a problem experienced while using the module should be addressed to the author directly (refer to the following point).
  • If you want to start a discussion with the author or have a question related to your purchase, please use the support page.