cool What's new and cool in Drupal 10.1

Drupal 10.1 comes packed with new exciting features for site builders, developers, and content editors. Let’s review what’s new in the release.  

Drupal 10.1 was released on June 22, 2023, marking yet another important milestone for the CMS. It brought Drupal to the limelight again, six months after we all welcomed the arrival of the 10th major version. The new exciting features of Drupal 10.1 deserve a closer look, so let’s review them:

Single Directory Components

One of the hottest new features in Drupal 10.1, set to become a game changer in front-end development, is Single Directory Components (SDC). Mike Herchel, one of the creators of SDC, called it the biggest paradigm shift in Drupal since 2013 when the Twig template was introduced.

With SDC, all files necessary to render a UI component (a button, a slider, an accordion, a carousel, and so on) are grouped together into a single directory. This may include files such as Twig, YAML, CSS, JavaScript, etc. Whenever a component is called, SDC generates a library and loads it. The functionality is implemented through a new experimental Single Directory Components module in the Drupal 10.1 core. 

The new experimental Single Directory Components module in Drupal 10.1

The new experimental Single Directory Components module in Drupal 10.1

Twig debugging and caching settings in the UI

It’s now possible to control Twig debugging and render caching settings by simply checking or unchecking the relevant checkboxes. There is a new “Development Settings” page for doing that in the Configuration > Development section of the Drupal admin UI. 

More specifically, you can check the “Twig development mode” checkbox, which exposes and checks the “Twig debug mode” and the “Disable Twig cache” checkboxes. In addition, there is a “Do not cache markup” checkbox, which disables render cache, dynamic page cache, and page cache. 

The new admin page in Drupal 10.1 with Twig debugging/caching settings

The new admin page in Drupal 10.1 with Twig debugging/caching settings

Autoformatting and improved code blocks in CKEditor 5

CKEditor 5, one of the most prominent updates in Drupal 10, keeps getting new features to simplify the work of content creators:

  • It now has a new autoformatting feature that enables you to quickly format your content without even using the toolbar. This feature relies on Markdown-like shortcodes — for example, by typing __ or ** around some text, you make it bold.
  • It’s now possible to configure the “Code block” button so it only shows specific programming or markup languages. The list of languages can be edited or expanded with new items at Configuration > Content Authoring > Text Formats and Editors.

The enhanced code block functionality for CKEditor 5 in Drupal 10.1

The enhanced code block functionality for CKEditor 5 in Drupal 10.1

A revamped actions bar for the Content page

Managing content items has become easier in Drupal 10.1 thanks to a totally revamped actions bar. Previously, it used to be located above the content list, with the default action being “Delete,” which is definitely not the first thing you’d want to do with your content items. 

In Drupal 10.1, the bar has moved to the bottom of the content list with no action selected by default. The bar is very interactive — it immediately shows the number of selected content items.

The new interactive actions bar below the content list in Drupal 10.1

The new interactive actions bar below the content list in Drupal 10.1

Revamped block management

Drupal 10.1 has a new dedicated “Block type” page under “Structure,” enabling you to create a new block type faster. Furthermore, the menu of actions that can be applied to a block type now has a “Manage permissions” option.

The new Manage permissions tab for a block type menu in Drupal 10.1

The new “Manage permissions” tab for a block type menu in Drupal 10.1

It redirects you to the Permissions page for a specific block type where you can find quite detailed permissions and assign them to specific user roles. Prior to Drupal 10.1, there was only the “Administer blocks” permission available, which was actually “all or nothing.”

Permissions for a block type in Drupal 10.1

Permissions for a block type in Drupal 10.1

The “Content” page now has a new “Block” tab where you can create content blocks of the block types that you have. Content blocks have revisions just like content nodes do, allowing you to roll back to their previous versions if needed. 

The new Block tab on the Content page in Drupal 10.1

The new “Block” tab on the “Content” page in Drupal 10.1

Revamped field re-use experience

When creating a new entity type, you can use a revamped interface to re-use existing fields in Drupal 10.1. There is a new “+Re-use an existing field” button on the “Manage fields” page. It opens a detailed view with information about the field storage configuration. You can quickly check it without navigating to the field list page.

The new Re-use an existing field button in Drupal 10.1

The new “+Re-use an existing field” button in Drupal 10.1

The detailed view with information about the fields that can be re-used in Drupal 10.1

The detailed view with information about the fields that can be re-used in Drupal 10.1

A new experimental core module — Announcements 

Important Drupal news can now arrive directly at your Drupal admin dashboard thanks to the new experimental Announcements module. When enabled, it displays a feed of announcements from drupal.org. You can control the visibility by granting the “View drupal.org announcements” permission to specific user roles (it’s only the Administrator by default).

The new experimental Announcements module in the Drupal 10.1 core

The new experimental Announcements module in the Drupal 10.1 core

An option to display dates as “Time ago”

There is a minor yet very useful improvement for the date field formatting. It’s now possible to display a time difference (e.g. “3 days ago”) instead of an absolute date and time. It’s just a matter of selecting the “Time ago” formatter for a date field on the Manage Display tab of an entity type.

The new Time ago option for date fields in Drupal 10.1

The new “Time ago” option for date fields in Drupal 10.1

And more

The official Drupal 10.1 press release by Gábor Hojtsy, the Drupal core product manager and initiative coordinator, also mentions new APIs for decoupled menus based on the Linkset standard, performance improvements, Axe Core accessibility scans, and more. It’s great to see the forward movement of the ever-evolving Drupal CMS and we excitedly anticipate what’s to come!