Loading...
Loading...
Implement property editor schemas in Umbraco backoffice using official docs
npx skill4agent add umbraco/umbraco-cms-backoffice-skills umbraco-property-editor-schemapropertyEditorSchemaAlias| Alias | Use Case |
|---|---|
| Simple string, no validation |
| Simple integer |
| Decimal numbers |
| Date/time values |
| JSON objects/arrays |
| String with maxlength validation |
| Multi-line text |
| Boolean values |
| Color values |
| Content node references |
| Media references |
| Multiple URL links |
| Tag collections |
| Rich text HTML |
{
"type": "propertyEditorUi",
"alias": "My.PropertyEditorUi.Custom",
"name": "My Custom Editor",
"element": "/App_Plugins/MyEditor/editor.js",
"meta": {
"propertyEditorSchemaAlias": "Umbraco.Plain.String"
}
}using Umbraco.Cms.Core.IO;
using Umbraco.Cms.Core.PropertyEditors;
using Umbraco.Cms.Core.Services;
namespace MyPackage.PropertyEditors;
[DataEditor(
alias: "My.PropertyEditor.Custom",
name: "My Custom Editor",
view: "~/App_Plugins/MyEditor/editor.html")]
public class MyPropertyEditor : DataEditor
{
private readonly IIOHelper _ioHelper;
private readonly IEditorConfigurationParser _editorConfigurationParser;
public MyPropertyEditor(
IDataValueEditorFactory dataValueEditorFactory,
IIOHelper ioHelper,
IEditorConfigurationParser editorConfigurationParser)
: base(dataValueEditorFactory)
{
_ioHelper = ioHelper;
_editorConfigurationParser = editorConfigurationParser;
SupportsReadOnly = true;
}
protected override IConfigurationEditor CreateConfigurationEditor() =>
new MyConfigurationEditor(_ioHelper, _editorConfigurationParser);
}using Umbraco.Cms.Core.IO;
using Umbraco.Cms.Core.PropertyEditors;
using Umbraco.Cms.Core.Services;
namespace MyPackage.PropertyEditors;
public class MyConfigurationEditor : ConfigurationEditor<MyConfiguration>
{
public MyConfigurationEditor(
IIOHelper ioHelper,
IEditorConfigurationParser editorConfigurationParser)
: base(ioHelper, editorConfigurationParser)
{
}
}
public class MyConfiguration
{
[ConfigurationField("maxItems", "Maximum Items", "number")]
public int MaxItems { get; set; } = 10;
[ConfigurationField("allowNull", "Allow Empty", "boolean")]
public bool AllowNull { get; set; } = true;
}using Umbraco.Cms.Core.Models.PublishedContent;
using Umbraco.Cms.Core.PropertyEditors;
namespace MyPackage.PropertyEditors;
public class MyValueConverter : PropertyValueConverterBase
{
public override bool IsConverter(IPublishedPropertyType propertyType)
=> propertyType.EditorAlias == "My.PropertyEditor.Custom";
public override Type GetPropertyValueType(IPublishedPropertyType propertyType)
=> typeof(MyModel);
public override object? ConvertSourceToIntermediate(
IPublishedElement owner,
IPublishedPropertyType propertyType,
object? source,
bool preview)
{
if (source is string json && !string.IsNullOrEmpty(json))
{
return JsonSerializer.Deserialize<MyModel>(json);
}
return null;
}
}