One of the major default data types in Umbraco is the Richtext Editor. The TinyMCE based wysiwyg editor. This is the standard editor used to edit any larger amount of text. The editor has a lot of settings, which can be changed under the developer section in “data types” / Richtext editor.

The editor also supports TinyMCE plugins which can be controlled in the configuration file located at /config/tinyMce.config

If we want to add font color, font family and font size functions to the TinyMCE menu is to add the three snippets below to config/tinyMceConfig.config.

<!-- Font color selector tool -->
<command>
    <umbracoAlias>mceForeColor</umbracoAlias>
    <icon>images/editor/forecolor.gif</icon>
    <tinyMceCommand value="" userInterface="true" frontendCommand="forecolor">forecolor</tinyMceCommand>
    <priority>76</priority>
</command>

<!-- Font family selector tool -->
<command>
    <umbracoAlias>mcefontselect</umbracoAlias>
    <icon>images/editor/fontselect.png</icon>
    <tinyMceCommand value="" userInterface="true" frontendCommand="fontselect">fontselect</tinyMceCommand>
    <priority>17</priority>
</command>

<!-- Font size selector tool -->
<command>
    <umbracoAlias>mcefontsizeselect</umbracoAlias>
    <icon>images/editor/fontsizeselect.png</icon>
    <tinyMceCommand value="" userInterface="true" frontendCommand="fontsizeselect">fontsizeselect</tinyMceCommand>
    <priority>18</priority>
</command>

After the above changes have been added to the tinyMceConfig.config file the new functions should be selectable in the datatype configuration.