dotCMS Block Editor

Introduction

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 will be the default content editor future forward in dotCMS, eventually replacing the more traditional TinyMCE WYSIWYG editor. Seamlessly integrated with Edit Mode (Anywhere), the Block Editor is the next generation of modern and agile content editing, further reducing developer dependency while making it easier than ever for content managers to use and re-use structured content.

Key Benefits 

• Increase flexibility, content re-use

• Shorten time-to-create

• Reduce developer dependencies

• Reduce Total Cost of Ownership (TCO)

• Increase Return On Investment (ROI)

• Enhance editor experience

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-like interface and experience, but the Block Editor is more intuitive, like the block editor in WordPress. 

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 (which can contain data from a commerce solution and images from an external DAM).

Standard Blocks

The Block Editor comes with several standard content blocks (with more on the way) that can speed content creation.

Content Data

Figures for character count, word count, and estimated reading time are 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 complete in-context editing experience in Edit Mode (Anywhere).

Images

dotCMS supports multiple ways to add images to a content block. Images can be dragged & dropped or pasted into the Block Editor. 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

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

Custom Blocks / Remote Extensions

The Block Editor is an extensible framework in dotCMS, allowing for custom blocks and remote extensions. It helps development teams to enrich the Block Editor with blocks tailored to the requirements of the business teams, driving efficiency 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.

Try 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.