Property Editors

Guide on how to work with and create Property Editors in Umbraco

This tutorial contains step-by-step instructions for building a custom Property Editor.

This section describes how to work with and create Property Editors. A Property Editor is the editor used to insert content into Umbraco. See the Property Editors overview for a detailed definition.

Custom Property Editors are registered in the umbraco-package.json file. This manifest file declares your Property Editor UI extension and links it to a Property Editor Schema. Learn more about the package manifest format and registration.

Add validation rules to your custom Property Editors to ensure data integrity. Learn how to implement client-side validation using the Form Control Mixin and create custom validation logic for your Property Editor UI.

A Property Editor is composed of two key extensions: Property Editor Schema and Property Editor UI. These components work together to define the data structure and user interface for content entry in the Umbraco backoffice.

Optionally, you can use a Property Editor Data Source to provide data to your Property Editor UI. This will allow the same UI to work with different data sources.

Convert the stored property data value to a useful, strongly-typed object returned by the Published Content APIs. This allows you to work with rich data types in your views and controllers instead of raw stored values.

Use Property Actions to add additional functionality to your custom Property Editors. This could include custom buttons or actions that appear alongside the editor in the backoffice.

Learn how to integrate and use Property Editors anywhere in the Umbraco backoffice using the umb-property and umb-property-dataset components. This guide covers implementing Property Editors in custom interfaces and scenarios.

Learn how to extend Property Editors to track entity references within the Property Editor. This enables Umbraco to understand relationships between content and helps with features like dependency tracking and content deletion warnings.

Understand how to use the Property Dataset Context API to manage data for multiple properties. This is essential when integrating Property Editors into custom views, workspaces, or scenarios outside of standard content editing.

More Information

Last updated

Was this helpful?