dotCMS Block Editor

Introduction

dotCMS is transforming content editing and taking content management to the next level with the Block Editor. The Block Editor is an intuitive, feature-rich interface for creating and managing structured content in dotCMS, regardless of the deployment model: headless or hybrid-headless.?The Block Editor is the pinnacle of composable content experiences.

The Block Editor will be the default content editor future forward in dotCMS and, eventually, take over more tasks from the more traditional TinyMCE editor. Seamlessly integrated with Edit Mode (Anywhere), the Block Editor is integral to the next generation of modern and agile content editing.?

The premise of the Block Editor is to reduce developer dependency even further and increase the NoCode experience composition with structured content in dotCMS.

Key Benefits?

• Flexible NoCode experience creation
• Drive time-to-value
• Reduce developer dependencies
• Reduce Total Cost of Ownership / Increase Return On Investment
• Enhance editor experience
• API-first

Content Block-based Approach

A block-based approach to content editing offers more flexibility to content editors than traditional editors without the need for underlying complexity in content modeling. Traditional WYSIWYG editors have a more MS Word-esque interface and experience, but the Block Editor is more intuitive and fluent.?

Nesting and alternating content and different content types in a single content block is one of the key advantages: blending marketing copy with product information (also containing data from a commerce solution and images from an external DAM, obviously).

Standard Blocks

The Block Editor comes with several standard content blocks (and counting) that can be leveraged by digital marketers and drive content velocity.

Content Data

Figures for character count, word count, and estimated reading time is available below the Block Editor field. Additionally, a character limit can be configured. More information on this feature can be found here.

Whitelisting

With the Block Editor, dotCMS admins can whitelist content types for content editors and restrict the number of blocks in a content block, which helps to streamline content creation and implement content governance simultaneously.?

Inline Editing

Like all other content in dotCMS, content blocks created by the Block Editor can be edited inline for a whole in-context editing experience in Edit Mode (Anywhere).

Images

dotCMS supports multiple ways to add images to a content block. First, images can be dragged & dropped into the Block Editor. In addition, the Block Editor also allows for pasting images into the content block. For images stored in dotCMS, content editors can search and add images seamlessly in the content block. In addition, content editors can upload an image or provide an image URL

Video

Next to images, the Block Editor also supports video blocks. It allows content editors to add a video to their content block quickly. The video can sit anywhere: in dotCMS or any external platform, such as Youtube, Vimeo, or any Video Management Solution (such as Brightcove, Kaltura, etc.).

Custom Blocks / Remote Extensions

The Block Editor is an extensible framework in dotCMS, and allows for extensibility with custom blocks and remote extensions. It allows development teams to enrich the Block Editor with blocks tailored to the requirements of the business teams, and it will drive content velocity and time-to-market. More on custom blocks and remote extensions in this video.

WYSIWYG to Block Editor conversion

In dotCMS, it is possible to transform existing WYSIWYG fields into Block Editor fields within any given Content Type without the hassle and expenses of a mass-data conversion process. More technical documentation is available here.

WYSIWYG vs. Block Editor

The table below summarizes the differences between traditional WYSIWYG and Block Editor.

Testing the Block Editor in dotCMS

You can explore the outstanding capabilities of the dotCMS Block Editor at your convenience in our online demo environment for Blog posts:

• Website https://demo.dotcms.com
• CMS backend: htpps://demo.dotcms.com/admin
• User: admin@dotcms.com?
• Password: admin

Note: the online demo environment is reset daily at 12 AM and 12 PM EST.