How to Enable Code View in Odoo HTML Fields

Abid Patel
08-Oct-2024 Updated : 08-Oct-2024

Learn how to enable Code View in Odoo HTML fields using options='{'codeview': true}' for advanced HTML editing and customization in Odoo ERP.

How to Enable Code View in Odoo HTML Fields

Odoo offers various customization options, especially for managing content in HTML fields. One useful feature you can enable is the Code View in HTML fields, which allows users to directly view and edit the HTML source code of the content. This feature is particularly helpful when advanced formatting or custom HTML elements are required. In this guide, we’ll explain how to enable Code View in Odoo HTML fields using the options="{'codeview': true}" parameter.

What is Code View in Odoo?

In Odoo, HTML fields are typically used for entering rich text, where users can format content using built-in editors. However, enabling Code View gives the user access to the underlying HTML, allowing for more complex formatting, embedding custom code, or making precise changes that are otherwise limited by the standard text editor.

Why Enable Code View in Odoo?

By enabling Code View in Odoo, you unlock the ability to:

  • ▹ Edit the raw HTML content of a field for fine-tuned customization.
  • ▹ Embed external widgets or scripts for dynamic content.
  • ▹ Directly control formatting and layout using HTML tags.
  • ▹ Improve flexibility for technical users who need to manage custom HTML structures.

How to Enable Code View in Odoo HTML Fields

Enabling Code View in Odoo’s HTML fields is straightforward. You just need to add the options="{'codeview': true}" attribute to the HTML field definition in the XML view. Here’s a step-by-step guide.

Step 1: Define the HTML Field in the XML View

To enable Code View, you need to modify the XML view where the HTML field is defined. Below is an example of how you can enable code view in an Odoo HTML field:

xml

<field name="description" widget="html" options="{'codeview': true}" string="Description" />

In this example, the description field is rendered as an HTML field, and we enable Code View by adding the options="{'codeview': true}" attribute. This will display a "Code View" button in the editor toolbar, allowing users to toggle between the visual editor and raw HTML code.

Step 2: Customize the Field in the Python Model

In the corresponding Python model, make sure to define the field as a text or HTML field to store rich text content. Here’s an example:

python

from odoo import models, fields

class ProductTemplate(models.Model):
    _inherit = 'product.template'

    description = fields.Html(string="Description")

This defines the description field in the product.template model as an HTML field. With this in place, the Code View functionality enabled in the XML view will work seamlessly.

Benefits of Enabling Code View

Here are some of the key benefits of enabling Code View in Odoo HTML fields:

  • ▹ Direct access to the HTML code for advanced customization.
  • ▹ Flexibility in embedding custom HTML elements and scripts.
  • ▹ Enhanced control over content formatting and structure.
  • ▹ Improved editing experience for technical users who are familiar with HTML.

Use Cases for Code View

Some practical scenarios where enabling Code View can be highly beneficial include:

  • ▹ Embedding custom videos, maps, or external widgets within product descriptions or blog posts.
  • ▹ Customizing email templates with advanced HTML layouts and styles.
  • ▹ Fine-tuning content for landing pages or sales materials with custom formatting.

Conclusion

Enabling Code View in Odoo HTML fields is a valuable feature that allows for greater control and flexibility in content management. By following the steps outlined above, you can easily enable this option and unlock the full potential of Odoo’s HTML fields. For more tips and advanced features, check out the Odoo official website or explore more customization options with Odoo Blogs.

Make a Comment

Your email address will not be published. Required fields are marked *