---
title: TinyMCE example: Allow added custom relative paths in TinyMCE
slug: cms-12/docs/example-extending-hyperlink-editor-descriptor
docTags: 
createdAt: 2026-08-10T15:55:58.000Z
---

:::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. It is used 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, the following dialog box displays an additional **Site relative link** field.

![After running the site, the following dialog box displays an additional Site relative link field](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/Y_rTfSnmyljzK1wZknoo_-20260722-184803.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);
```
