Next Generation Authoring- code editor
Release date: 22nd January 2025
In this release we've made some enhancements to Next Generation Authoring, improved performance and fixed some bugs.
The new code editor input field component allows you to add an editable text field formatted for a range of languages including JavaScript, JSON and HTML. This is useful if you're adding bespoke HTML or CSS to some of your pages, during your site development, for example.
We've also made some improvements to the way that extensions are displayed, allowing you to choose whether header information, such as title, description and locale label, are shown.
About Next Generation AuthoringLink copied!
Next Generation Authoring provides an enhanced authoring experience, with features for users and developers. It's currently switched off by default and we encourage you to switch it on and start making use of the new features, including:
An enhanced "look and feel" available "out of the box" when you switch on Next Generation Authoring
New developer features such as customizable input fields and schema enhancements such as conditionals
Control over form layout using tabs, grids and dividers
- Content palettes to make it easier to work with flexible lists of different types of content
Visit the What's new page for an introduction to the new features.
The code editorLink copied!
The code editor is used in the same way as any other input field component that works with a string field. You can specify validation and set it to read only, as well as setting some default text, useful if you want to add some boilerplate code.
The language parameter in the component settings allows you to format the text for the language you require (HTML, CSS, JavaScript, Typescript, jsx and tsx are supported).
The example below shows a code editor component field formatted for HTML. The syntax highlighting and formatting makes it easier to spot any errors, while the output is just a JSON string. Right-click to access a menu with additional formatting options.
See the code editor component reference for more information and an example. We've also included a schema example.
Extension header and locale fieldsLink copied!
A new withHeader setting in extension parameters allows you to choose to display header information for extensions, including the locale label for localized extensions and the title and description.
The example below shows the locale labels shown for the Generative rich text editor extension attached to a field level localized property.
You can find more details and an example on the What's new page.
Fixed issuesLink copied!
This release also includes fixes for a number of bugs. The FAQs page is regularly updated with the latest bug fixes and outstanding issues.