This article will be continuation of the previous series about TinyMCE extensions. Today I would like to describe an add-on that allows inserting dynamic fields (macro) into TinyMCE editor that are replaced with custom value when rendering the page.

Macro support

Macro support

In the image above, when the page is rendered, the %%%USER_NAME%%% field will be replaced with the name of the logged-in user name from PrincipalAccessor principalAccessor?.Principal?.Identity?.Name

Macro support view mode

Similar behaviour could be achieved using blocks inside TinyMCE. However, blocks are rendered as DIV elements which makes it difficult to render dynamic values as inline inside the text.

Beside that, I have to mention, that plugin does not handle caching, so it has to be configured by the developer.

Registering custom macro

By default, only UserName variable is registered, because sites can have different requirements for macros.

But the plugin provides a simple way to register your own macros. All you need to do is register a class that implements the ITinyMceMacroVariable interface and implement fields:

Name Required Description
Key Yes Unique identifier for macro variable. It will be used inside TinyMCE editor as variable.
DisplayName No Text displayed in TinyMCE toolbar dropdown. By default Key is used.
Rank No Used to sort macros. By default 100 is used.
GetValue Yes Function that returns macro value used in view mode.

No Javascript code is required to register new macro.


For example , we would like to register a new macro variable, which will be replaced with a phone number for the contact. The number will be stored as a string property on StartPage.

Macro support property

Now we have to create TinyMcePhoneMacro class that implements ITinyMceMacroVariable interface and register it in container using ServiceConfiguration attribute.

When resolving macro value, we get StartPage and read ContactPhone property.

That’s it. The variable is automatically registered in TinyMCE list of available macros and Editor can start using it.

Macro support phone number


To turn on macro support we have to add AddTinyMceMacroVariables to the startup.cs

Plugin is available as Nuget package. You can check source code and report bugs on github