TinyMCE Editor for HTML Field
by Steven Marp https://apps.odoo.com/apps/browse?repo_maintainer_id=512936$ 68.44
| Availability |
Odoo Online
Odoo.sh
On Premise
|
| Odoo Apps Dependencies |
•
Invoicing (account)
• Discuss (mail) |
| Lines of code | 170 |
| Technical Name |
sm_tinymce_editor |
| License | OPL-1 |
| Website | https://apps.odoo.com/apps/browse?repo_maintainer_id=512936 |
| Versions | 18.0 19.0 |
| Availability |
Odoo Online
Odoo.sh
On Premise
|
| Odoo Apps Dependencies |
•
Invoicing (account)
• Discuss (mail) |
| Lines of code | 170 |
| Technical Name |
sm_tinymce_editor |
| License | OPL-1 |
| Website | https://apps.odoo.com/apps/browse?repo_maintainer_id=512936 |
| Versions | 18.0 19.0 |
TinyMCE Editor for HTML Field
Replace the default Odoo HTML editor with TinyMCE — the world's most popular open-source WYSIWYG editor
Module Video Overview
Features
1 Rich text formattingBold, italic, underline, strikethrough, headings (H1–H6), blockquotes, alignment, font colors, font family, font size — a complete word-processor toolbar at your fingertips. Everything you need for professional content editing. |
2 Tables & mediaInsert and edit tables with full control: resize columns, style borders, merge/split cells. Embed images via URL, insert videos and audio from external sources. Tables are rendered as clean HTML. |
3 Code view & code samplesSwitch to raw HTML source code editing at any time. Insert formatted code blocks with syntax highlighting using the Code Sample plugin. Perfect for developers who need precise HTML control. |
4 Search & replaceFind and replace text within the editor with case-sensitive matching and full regex support. Replace all at once or one-by-one — just like a desktop word processor. |
5 Easy integration
Simply add |
6 No license key neededTinyMCE core is open source under the MIT license. This module loads the community version from CDN — completely free. No API key, no subscription, no watermark. Just install and use. |
How to Use
|
Step 1: Install the module from the Odoo Apps Store or your addons directory.
Step 2: Add
<field name="description" widget="tinymce"/>
That's it! The field will now use TinyMCE instead of the default editor. |
Included Plugins
Text & Listsadvlist, autolink, lists, link, anchor — complete text editing and linking capabilities. |
Media & Visualsimage, media, charmap, emoticons, visualblocks — insert images, videos, emoji, and special characters. |
Developer Toolscode, codesample, searchreplace, preview, fullscreen — HTML source editing and advanced search. |
TablesFull table support: insert, resize, merge cells, style borders, and customize backgrounds. |
Word CountLive word and character count displayed in the status bar. Know exactly how much you've written. |
HelpBuilt-in TinyMCE help dialog with keyboard shortcuts and editor documentation. |
Support
We provide free bug fixes and updates for all our modules. If you need help, please submit a support request through the Odoo Apps support page. Our team is always ready to assist you.
TinyMCE Editor for HTML Field — Documentation
Table of Contents
1. Getting Started
Prerequisites
Before installing, make sure your environment meets these requirements:
| Requirement | Description |
|---|---|
| Odoo Version | 19.0 (Community or Enterprise) |
| Internet Connection | Required for loading TinyMCE from CDN (first load only; browser caches it afterwards) |
Installation
- Upload the sm_tinymce_editor module folder to your server's custom addons directory.
- Restart the Odoo service to detect the new module.
- Navigate to Apps menu, click Update Apps List.
- Search for "TinyMCE Editor for HTML Field" and click Install.
Note
After installation, the tinymce widget becomes available for any HTML field in Odoo backend views. No additional configuration is required.
2. Usage
Adding TinyMCE to a Field
To replace the default Odoo HTML editor on a specific field, add widget="tinymce" in your XML view definition:
<field name="description" widget="tinymce"/>
Inheriting an existing view
You can also use xpath to add the widget to existing views:
<record id="view_order_form_tinymce" model="ir.ui.view"> <field name="name">sale.order.form.tinymce</field> <field name="model">sale.order</field> <field name="inherit_id" ref="sale.view_order_form"/> <field name="arch" type="xml"> <xpath expr="//field[@name='note']" position="attributes"> <attribute name="widget">tinymce</attribute> </xpath> </field> </record>
Tip
This module already applies widget="tinymce" to the Sale Order's Terms and Conditions (note) field out of the box.
3. Features
Rich Text Editing
TinyMCE provides a full word-processor toolbar:
- Text formatting: Bold, Italic, Underline, Strikethrough
- Paragraphs: Headings (H1–H6), Blockquote, Alignment
- Lists: Ordered, Unordered, Checklist (advlist)
- Colors: Font color, Background color
- Font: Font family, Font size
Tables
Full table editing support:
- Insert tables with custom rows/columns
- Resize columns by dragging
- Cell background and border styling
- Merge/split cells
Media
- Insert images via URL
- Embed video and audio from external sources
- Character map for special symbols
- Emoticon picker with search
Code Editing
- Code View: Switch to raw HTML source editing
- Code Sample: Insert formatted code blocks with syntax highlighting
- Visual Blocks: See block-level elements outlined in the editor
Search & Replace
Built-in find & replace with:
- Case-sensitive matching
- Full regex support
- Replace all or one-by-one
Other Features
- Fullscreen: Expand the editor to full browser window
- Word Count: Live word and character count in the status bar
- Auto Link: URLs typed in the editor are auto-converted to clickable links
- Anchor: Insert named anchors for in-page navigation
- Preview: Preview the content in a new window
4. Included Plugins
The following TinyMCE plugins are enabled by default:
| Plugin | Description |
|---|---|
| advlist | Advanced list formatting (bullet styles) |
| autolink | Auto-convert typed URLs to links |
| lists | Ordered and unordered lists |
| link | Insert/edit hyperlinks |
| image | Insert images via URL |
| charmap | Special character picker |
| preview | Preview HTML content |
| anchor | Named anchors for navigation |
| searchreplace | Find and replace text |
| visualblocks | Show block-level element borders |
| code | Raw HTML source editing |
| fullscreen | Maximize editor to full window |
| media | Embed video/audio |
| table | Insert/edit tables |
| wordcount | Word and character count |
| emoticons | Emoji picker with search |
| codesample | Code blocks with syntax highlighting |
| help | Built-in TinyMCE help dialog |
5. Technical Details
How It Works
- The module registers a custom Odoo field widget named tinymce.
- When a form view renders a field with widget="tinymce", the component loads the TinyMCE library from the jsDelivr CDN (cdn.jsdelivr.net).
- TinyMCE is initialized on a <textarea> element inside the field container.
- Content changes in TinyMCE are synced back to the Odoo record via record.update().
- In readonly mode, the field renders the HTML content directly (no editor loaded).
CDN Loading
TinyMCE is loaded from:
https://cdn.jsdelivr.net/npm/tinymce@7/tinymce.min.js
The script is loaded once and cached by the browser. Subsequent page loads use the cached version. The library is NOT bundled with the module to keep the module size small and ensure you always get the latest patch version.
6. FAQ
- Does this replace the default Odoo editor globally?
- No. Only fields with widget="tinymce" use TinyMCE. All other HTML fields continue using Odoo's default editor.
- Do I need an API key or license?
- No. TinyMCE core is open source under the MIT license. This module uses the community (self-hosted via CDN) version — completely free.
- Does it work offline?
- The TinyMCE library must be loaded from CDN at least once. After that, the browser caches it. You need an internet connection for the initial load.
- Is it compatible with Odoo Enterprise?
- Yes. Works with both Community and Enterprise editions.
- Can I use it on any HTML field?
- Yes. Any field of type Html can use widget="tinymce".
7. Support
We provide free bug fixes and updates for all our modules. If you need help, please submit a support request through the Odoo Apps support page.
Odoo Proprietary License v1.0 This software and associated files (the "Software") may only be used (executed, modified, executed after modifications) if you have purchased a valid license from the authors, typically via Odoo Apps, or if you have received a written agreement from the authors of the Software (see the COPYRIGHT file). You may develop Odoo modules that use the Software as a library (typically by depending on it, importing it and using its resources), but without copying any source code or material from the Software. You may distribute those modules under the license of your choice, provided that this license is compatible with the terms of the Odoo Proprietary License (For example: LGPL, MIT, or proprietary licenses similar to this one). It is forbidden to publish, distribute, sublicense, or sell copies of the Software or modified copies of the Software. The above copyright notice and this permission notice must be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Please log in to comment on this module