---
title: TinyMCE example: Allow added custom relative paths in TinyMCE
slug: cms-11/dev-docs/example-extending-hyperlink-editor-descriptor
docTags: 
createdAt: 2026-07-22T19:45:17.341Z
---

:::hint{type="info"}
**Note**
This example applies to CMS UI 11.21.1 and higher.
:::

This scenario shows how to extend the `HyperLink` editor descriptor and use the TinyMCE custom link dialog to let an editor create links relative to the site. For example, if the site host is `www.alloydemo.com` and the relative link is `news/my-video`, the link will redirect to `www.alloydemo.com/news/my-video`.

1. Register an `EditorDescriptor` for `HyperLink UIHint`. Set the `EditorDescriptorBehavior` to `PlaceLast`. As a result, the original descriptor is executed first, and you can apply custom settings.

```csharp
using System;
using System.Collections.Generic;
using System.Linq;
using EPiServer.Shell.ObjectEditing;
using EPiServer.Shell.ObjectEditing.EditorDescriptors;

namespace AlloyTemplates.Business.EditorDescriptors {
  [EditorDescriptorRegistration(
    TargetType = typeof (string),
    UIHint = "HyperLink",
    EditorDescriptorBehavior = EditorDescriptorBehavior.PlaceLast)]
  internal class CustomLinkEditorDescriptor: EditorDescriptor {
    public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes) {
      base.ModifyMetadata(metadata, attributes);

      if (!metadata.EditorConfiguration.ContainsKey(("providers"))) {
        return;
      }

      var providers = (metadata.EditorConfiguration["providers"] as IEnumerable<object>).ToList();

      providers.Add(new {
        Name = "Site link",
          Title = "Site link",
          DisplayName = "Site relative link",
          WidgetType = "dijit/form/ValidationTextBox"
      });

      metadata.EditorConfiguration["providers"] = providers;
    }
  }
}
```

2. In the `ModifyMetadata` method, register the provider to handle custom relative links.

The `Provider` requires a `WidgetType`, which is a Dojo widget class used to edit the value of the provider. In this case, it is a standard `ValidationTextbox`. After running the site, you should see a dialog box with an additional **Site relative link** field.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/N8-4g39byWg_TX7ZC9Ap5-20260722-194642.png "extended-link-dialog.png")

3. To make relative links work in TinyMCE, set the `convert_urls` setting to `false`, to prevent TinyMCE from converting the value.

```csharp
config.Default()
  .ContentCss(locator.GetInstance<IVirtualPathResolver>().ToAbsolute("~/static/css/editor.css"))
  .BodyClass("custom_partner_body_class")
  .AddPlugin("code")
  .InitializationScript("alloy/advancedTinyMCEConfig")
  .AddSetting("convert_urls", false);
```