Skip to content

Commit a98d6fd

Browse files
committed
Documents UFM Filters
1 parent d3efc89 commit a98d6fd

File tree

1 file changed

+28
-0
lines changed

1 file changed

+28
-0
lines changed

15/umbraco-cms/reference/umbraco-flavored-markdown.md

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,19 @@ With this example, the syntax `{umbValue: bodyText}` would be processed and rend
3939
The internal working of the `ufm-label-value` component would then be able to access the property's value using the [Context API](../extending/backoffice-setup/working-with-data/context-api).
4040

4141

42+
### Filters
43+
44+
In addition, a filter syntax can be applied to UFM contents. This can be useful for formatting or transforming a value without needing to develop your own custom UFM component.
45+
46+
The syntax for UFM filters by using a pipe character `|` (U+007C Vertical Line). Multiple filters may be applied. The value from the previous filter is passed onto the next.
47+
48+
For example, to display a rich text value, stripping out the HTML markup and limiting it to the first 15 words could use the following filters:
49+
50+
```markdown
51+
{umbValue: bodyText | strip-html | word-limit:15}
52+
```
53+
54+
A list of available UFM filters is detailed below.
4255

4356

4457
## UFM components
@@ -81,6 +94,21 @@ The alias prefix is `umbContentName` An example of the syntax is `{umbContentNa
8194
As of Umbraco 15.0.0, the Content Name component supports the content-based pickers, e.g. Document Picker, Content Picker (formerly known as Multinode Treepicker) and Member Picker. Support for the advanced Media Picker will be available in upcoming Umbraco release.
8295

8396

97+
### Available UFM filters
98+
99+
As of Umbraco 15.0.0, the following UFM filters are available to use.
100+
101+
| Name | Alias | Example syntax |
102+
| ---------- | ------------ | -------------------------------------- |
103+
| Lowercase | `lowercase` | `{umbValue: headline | lowercase}` |
104+
| Strip HTML | `strip-html` | `{umbValue: bodyText | strip-html}` |
105+
| Title Case | `title-case` | `{umbValue: headline | title-case}` |
106+
| Truncate | `truncate` | `{umbValue: intro | truncate:30:...}` |
107+
| Uppercase | `uppercase` | `{umbValue: headline | uppercase}` |
108+
| Word Limit | `word-limit` | `{umbValue: intro | word-limit:15}` |
109+
110+
More UFM filters may be available in upcoming Umbraco releases.
111+
84112
If you wish to develop your own custom UFM component, you can use the `ufmComponent` extension type:
85113

86114
```json

0 commit comments

Comments
 (0)