---
title: Register a custom editor
slug: cms-11/dev-docs/registering-a-custom-editor
docTags: 
createdAt: 2026-07-22T19:45:19.315Z
---

To create the actual dojo editor, see [Create an editor widget](docId\:cTLPxl9dUrsp9xLAX8FhU).

The following example demonstrates how to register a custom editor.

```csharp
[EditorDescriptorRegistration(TargetType = typeof (String[]), UIHint = Global.SiteUIHints.Strings)]
public class StringListEditorDescriptor: EditorDescriptor {
  public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes) {
    ClientEditingClass = "alloy/editors/StringList";
    base.ModifyMetadata(metadata, attributes);
  }
}
```

Using the following technique, you can pass data from the server to the client-side editor.

The following example shows how to pass an array of strings created on the server into a custom `StringList` editor from the previous example:

```csharp
[EditorDescriptorRegistration(TargetType = typeof (String[]), UIHint = Global.SiteUIHints.Strings)]
public class StringListEditorDescriptor: EditorDescriptor {
  public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes) {
    base.ModifyMetadata(metadata, attributes);
    var reservedWords = new [] {
      "foo",
      "bar",
      "foobar"
    };
    //This array will be converted to a JSON object and passed to the constructor of the editor widget.        
    metadata.EditorConfiguration.Add("reservedWords", reservedWords);
  }
}
```

The previous examples affect forms and on-page editing view. However, you can specify different settings for both views:

```csharp
[EditorDescriptorRegistration(TargetType = typeof (float))]
public class FloatNumberEditorDescriptor: EditorDescriptor {
  public FloatNumberEditorDescriptor() {
    //The default editing class that will be used in forms editing mode.
    ClientEditingClass = "dijit/form/NumberTextBox";
  }

  public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes) {
    base.ModifyMetadata(metadata, attributes);

    if (!attributes.OfType<RangeAttribute>().Any()) {
      var constraints = new Dictionary<string,object>() {
          {
            "min",
            Double.MinValue
          }, {
            "max",
            Double.MaxValue
          }
        };
      //These settings will be passed to the constructor of the editor widget.
      metadata.EditorConfiguration.Add("constraints", constraints);
    }

    //Define what kind of editor we want to have, in this case we want to create an inline editor. This is used
    //when the user is in OPE ("on page editing") mode.
    metadata.CustomEditorSettings["uiWrapperType"] = UiWrapperType.Inline;
    //Specify the class for a custom editor responsible for the actual editing in OPE.
    //If not defined the default (forms) editor will be used.
    metadata.CustomEditorSettings["uiType"] = "dijit/form/NumberTextBox";
  }
}
```

You can find a complete example of creating a custom dojo editor in the Alloy sample site, available on [GitHub](https://github.com/episerver/alloy-mvc-template).
