Skip to content
Merged
Show file tree
Hide file tree
Changes from 23 commits
Commits
Show all changes
31 commits
Select commit Hold shift + click to select a range
cce2eef
Update code samples for v15
greystate Aug 26, 2025
6ceb499
Updated screenshot of editor definition
greystate Aug 26, 2025
19915d9
Removed code referring to integer IDs
greystate Aug 26, 2025
df1a181
Remove unnecessary code block
greystate Sep 25, 2025
17fc763
(whitespace)
greystate Sep 25, 2025
32dd338
Fix image captions
greystate Sep 25, 2025
ca416da
Rewrite paragraphs to satisfy word count rule
greystate Sep 25, 2025
8c99a71
Fix code samples
greystate Sep 25, 2025
4ef8358
Remove unnecessary usings in Models Builder samples
greystate Sep 25, 2025
b2b149a
Remove reference to using integer Ids
greystate Sep 25, 2025
df7a98a
Update Content view screenshot
greystate Sep 25, 2025
d37c7b7
Add warning about status of TinyMCE in v15
greystate Sep 25, 2025
9e12bbc
Update screenshot for the data-type
greystate Sep 26, 2025
a19e123
Remove section about using integer Ids
greystate Sep 26, 2025
ab6c338
Update data type screenshot
greystate Sep 26, 2025
96cfbbb
Update screenshots of editor in content
greystate Sep 26, 2025
911963e
Update razor examples
greystate Sep 26, 2025
509a872
Update "Add values programmatically" section
greystate Sep 26, 2025
783229b
Rewrite paragraphs to satisfy Vale rule (sentence length)
greystate Sep 26, 2025
2371865
Update Data Type screenshot
greystate Sep 26, 2025
67f3e6f
Update screenshot of Content
greystate Sep 26, 2025
d228ee5
Fix Razor code samples
greystate Sep 26, 2025
451870e
Remove section about using integer Ids
greystate Sep 26, 2025
7483058
Update 15/umbraco-cms/fundamentals/backoffice/property-editors/built-…
greystate Oct 21, 2025
aa244f8
Remove hints about not being checked against latest versions
greystate Oct 21, 2025
3f99e89
Remove link to self
greystate Oct 21, 2025
74d450c
Merge branch 'issue-7220-upload-field' of https://github.com/greystat…
greystate Oct 21, 2025
0348c4f
Add suggestions from @mikecp
greystate Oct 21, 2025
b83b5f4
Update content screenshot
greystate Oct 21, 2025
2ee18c4
Apply suggestion from @eshanrnh
eshanrnh Oct 28, 2025
69ae969
Formatted text
eshanrnh Oct 28, 2025
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -33,22 +33,18 @@ Example: `"/media/o01axaqu/guidelines-on-remote-working.pdf"`
### Without Models Builder

```csharp
@using System.IO;
@{
if (Model.HasValue("myFile"))
{
var myFile = Model.Value<string>("myFile");

<a href="@myFile">@System.IO.Path.GetFileName(myFile)</a>
}
@if (Model.HasValue("myFile"))
{
var myFile = Model.Value<string>("myFile");

<a href="@myFile">@System.IO.Path.GetFileName(myFile)</a>
}
```

### With Models Builder

```csharp
@if (!Model.HasValue(Model.MyFile))
@if (Model.HasValue("MyFile"))
{
<a href="@Model.MyFile">@System.IO.Path.GetFileName(Model.MyFile)</a>
}
Expand All @@ -69,6 +65,10 @@ The example below demonstrates how to add values programmatically using a Razor
{% endhint %}

```csharp
@using System.Net
@using Umbraco.Cms.Core
@using Umbraco.Cms.Core.Services
@using Umbraco.Cms.Core.PropertyEditors
@using Umbraco.Cms.Core.IO
@using Umbraco.Cms.Core.Serialization
@using Umbraco.Cms.Core.Strings
Expand Down Expand Up @@ -115,22 +115,13 @@ The example below demonstrates how to add values programmatically using a Razor
}
```

Although the use of a GUID is preferable, you can also use the numeric ID to get the page:

```csharp
@{
// Get the page using it's id
var content = ContentService.GetById(1234);
}
```

If Models Builder is enabled you can get the alias of the desired property without using a magic string:

```csharp
@using Umbraco.Cms.Core.PublishedCache
@inject IPublishedContentTypeCache PublishedContentTypeCache
@{
// Set the value of the property with alias 'myFile'
content.SetValue(Home.GetModelPropertyType(PublishedContentTypeCache, x => x.MyFile).Alias, publishedMedia.Url();
// Set the value of the property `MyFile` by looking up its alias
content.SetValue(Home.GetModelPropertyType(PublishedContentTypeCache, x => x.MyFile).Alias, publishedMedia.Url());
}
```
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
Expand Up @@ -6,19 +6,22 @@

`Returns: IEnumerable<Link> or Link`

Multi Url Picker allows an editor to pick and sort multiple urls. This property editor returns a single item if the "Maximum number of items" Data Type setting is set to 1 or a collection if it is 0. These can either be internal, external or media.
Multi Url Picker allows an editor to pick and sort multiple URLs.
It returns either a single item or a collection. This depends on the "Maximum number of items" Data Type setting.
When that is set to 1, it returns a single item, otherwise a collection.
These can either be internal, external or media.

## Data Type Definition Example

![Related Links Data Type Definition](images/Multi-Url-Picker-DataType.png)
![Multi URL Picker Data Type Definition](images/Multi-Url-Picker-DataType.png)

## Content Example

![Media Picker Content](../../../../../../10/umbraco-cms/fundamentals/backoffice/property-editors/built-in-property-editors/images/Multy-Url-Picker-Content-v8.png)
![Multi URL Picker Content](../../../../../../10/umbraco-cms/fundamentals/backoffice/property-editors/built-in-property-editors/images/Multy-Url-Picker-Content-v8.png)

## MVC View Example - value converters enabled
## MVC View Example

## Typed
### Without Models Builder

```csharp
@using Umbraco.Cms.Core.Models
Expand All @@ -36,7 +39,7 @@ Multi Url Picker allows an editor to pick and sort multiple urls. This property
}
```

If `Max number of items` is configured to `1`
This example handles the case of `Maximum number of items` set to `1`:

```csharp
@using Umbraco.Cms.Core.Models
Expand All @@ -49,6 +52,36 @@ If `Max number of items` is configured to `1`
}
```

### With Models Builder

```csharp
@{
var links = Model.FooterLinks;
if (links.Any())
{
<ul>
@foreach (var link in links)
{
<li><a href="@link.Url" target="@link.Target">@link.Name</a></li>
}
</ul>
}
}
```

And here's the case of `Maximum number of items` set to `1`:

```csharp
@{
var link = Model.Link;
if (link != null)
{
<a href="@link.Url" target="@link.Target">@link.Name</a>
}
}
```


## Add values programmatically

See the example below to see how a value can be added or changed programmatically. To update a value of a property editor you need the [Content Service](https://apidocs.umbraco.com/v15/csharp/api/Umbraco.Cms.Core.Services.ContentService.html).
Expand Down Expand Up @@ -126,15 +159,6 @@ The example below demonstrates how to add values programmatically using a Razor
}
```

Although the use of a GUID is preferable, you can also use the numeric ID to get the page:

```csharp
@{
// Get the page using it's id
var content = ContentService.GetById(1234);
}
```

If Models Builder is enabled you can get the alias of the desired property without using a magic string:

```csharp
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,17 @@
`Returns: HTML`

{% hint style="warning" %}
This article is a work in progress and may undergo further revisions, updates, or amendments. The information contained herein is subject to change without notice.
In Umbraco 15, the Rich Text Editor has a new default property editor UI that introduces Tiptap as an alternative.

You can continue to use the [TinyMCE UI for the Rich Text Editor](../rich-text-editor-tinymce/). This UI will be removed in Umbraco 16.
{% endhint %}

The Rich Text Editor (RTE) is highly configurable and based on [TinyMCE](https://www.tinymce.com/). Depending on the configuration, it will give your content editors more flexibility when working with content that should be more than plain text.

{% hint style="info" %}
**Are you using custom configurations or plugins with TinyMCE?**

In Umbraco 11 the TinyMCE version supported has been upgraded from version 4 to version 6. You need to migrate to the latest version if you are using TinyMCE plugins or custom configuration.
In Umbraco 11 the TinyMCE version supported was upgraded from version 4 to version 6. You need to migrate to the latest version if you are using TinyMCE plugins or custom configuration.

If your site is upgraded from an older version, follow the migration guides below to upgrade the TinyMCE version as well.

Expand All @@ -25,7 +27,7 @@ If your site is upgraded from an older version, follow the migration guides belo

## [Configuration options](configuration.md)

Customize everything from toolbar options to editor size to where pasted images are saved.
Customize everything from toolbar options and editor size to where pasted images are saved.

## [Styles](styles.md)

Expand All @@ -41,11 +43,11 @@ Extend the functionality of the Rich Text Editor with plugins.

## Data Type Definition Example

![Rich Text Editor - Data Type](images/rte-datatype-v10.png)
![Rich Text Editor - Data Type](images/rte-datatype-v15.png)

## Content Example

![Rich Text Editor - Content](images/rte-content-11.png)
![Rich Text Editor - Content](images/rte-content-v15.png)

## MVC View Example

Expand Down Expand Up @@ -99,15 +101,6 @@ The example below demonstrates how to add values programmatically using a Razor
}
```

Although the use of a GUID is preferable, you can also use the numeric ID to get the page:

```csharp
@{
// Get the page using it's id
var content = ContentService.GetById(1234);
}
```

If Models Builder is enabled you can get the alias of the desired property without using a magic string.

```csharp
Expand Down
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ Find the full documentation for the property in the [Media Picker](media-picker-

## Content Example

![Content Example Empty](../../../../../../10/umbraco-cms/fundamentals/backoffice/property-editors/built-in-property-editors/images/content-example-empty.png) ![Content Example](../../../../../../10/umbraco-cms/fundamentals/backoffice/property-editors/built-in-property-editors/images/File-Upload-content-example.png)
![Content Example Empty](images/fileupload-content-empty.png) ![Content Example](images/fileupload-content.png)

In code, the property is a string, which references the location of the file.

Expand All @@ -33,22 +33,18 @@ Example: `"/media/o01axaqu/guidelines-on-remote-working.pdf"`
### Without Models Builder

```csharp
@using System.IO;
@{
if (Model.HasValue("myFile"))
{
var myFile = Model.Value<string>("myFile");

<a href="@myFile">@System.IO.Path.GetFileName(myFile)</a>
}
@if (Model.HasValue("myFile"))
{
var myFile = Model.Value<string>("myFile");

<a href="@myFile">@System.IO.Path.GetFileName(myFile)</a>
}
```

### With Models Builder

```csharp
@if (!Model.HasValue(Model.MyFile))
@if (Model.HasValue("myFile"))
{
<a href="@Model.MyFile">@System.IO.Path.GetFileName(Model.MyFile)</a>
}
Expand All @@ -69,6 +65,10 @@ The example below demonstrates how to add values programmatically using a Razor
{% endhint %}

```csharp
@using System.Net
@using Umbraco.Cms.Core
@using Umbraco.Cms.Core.Services
@using Umbraco.Cms.Core.PropertyEditors
@using Umbraco.Cms.Core.IO
@using Umbraco.Cms.Core.Serialization
@using Umbraco.Cms.Core.Strings
Expand Down Expand Up @@ -115,15 +115,6 @@ The example below demonstrates how to add values programmatically using a Razor
}
```

Although the use of a GUID is preferable, you can also use the numeric ID to get the page:

```csharp
@{
// Get the page using it's id
var content = ContentService.GetById(1234);
}
```

If Models Builder is enabled you can get the alias of the desired property without using a magic string:

```csharp
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
Expand Up @@ -6,19 +6,22 @@

`Returns: IEnumerable<Link> or Link`

Multi Url Picker allows an editor to pick and sort multiple urls. This property editor returns a single item if the "Maximum number of items" Data Type setting is set to 1 or a collection if it is 0. These can either be internal, external or media.
Multi Url Picker allows an editor to pick and sort multiple URLs.
It returns either a single item or a collection. This depends on the "Maximum number of items" Data Type setting.
When that is set to 1, it returns a single item, otherwise a collection.
These can either be internal, external or media.

## Data Type Definition Example

![Related Links Data Type Definition](images/Multi-Url-Picker-DataType.png)

## Content Example

![Media Picker Content](../../../../../../10/umbraco-cms/fundamentals/backoffice/property-editors/built-in-property-editors/images/Multy-Url-Picker-Content-v8.png)
![Multi Url Picker Content](images/Multi-Url-Picker-Content.png)

## MVC View Example - value converters enabled
## MVC View Example

## Typed
### Without Models Builder

```csharp
@using Umbraco.Cms.Core.Models
Expand All @@ -36,7 +39,7 @@ Multi Url Picker allows an editor to pick and sort multiple urls. This property
}
```

If `Max number of items` is configured to `1`
This example handles the case of `Maximum number of items` set to `1`:

```csharp
@using Umbraco.Cms.Core.Models
Expand All @@ -49,6 +52,37 @@ If `Max number of items` is configured to `1`
}
```

### With Models Builder

```csharp
@{
var links = Model.FooterLinks;
if (links.Any())
{
<ul>
@foreach (var link in links)
{
<li><a href="@link.Url" target="@link.Target">@link.Name</a></li>
}
</ul>
}
}
```

And here's the case of `Maximum number of items` set to `1`:

```csharp
@{
var link = Model.Link;
if (link != null)
{
<a href="@link.Url" target="@link.Target">@link.Name</a>
}
}
```



## Add values programmatically

See the example below to see how a value can be added or changed programmatically. To update a value of a property editor you need the [Content Service](https://apidocs.umbraco.com/v15/csharp/api/Umbraco.Cms.Core.Services.ContentService.html).
Expand Down Expand Up @@ -126,15 +160,6 @@ The example below demonstrates how to add values programmatically using a Razor
}
```

Although the use of a GUID is preferable, you can also use the numeric ID to get the page:

```csharp
@{
// Get the page using it's id
var content = ContentService.GetById(1234);
}
```

If Models Builder is enabled you can get the alias of the desired property without using a magic string:

```csharp
Expand Down