Html Fields

In general it's recommended to rally around the canvas format as much as possible as canvas is inherently frontend safe and not tied to the quirks of html "tag soup". However though, there are certainly times where just having a well supported HTML editor is absolutely beneficial. For that role we recommend installing the TinyMCE module.

Installing a HTML editor

Install TinyMCE like so:

socialstack i Admin/TinyMCE

Because of the previously mentioned unsafe nature of HTML, tinyMCE is initially present as an admin only module. As with all admin modules though, you can simply relocate the folder from Admin/Source/ThirdParty to the UI/Source directory and it will then be available on both the admin panel and the frontend.

Declaring a HTML field

When TinyMCE is installed, it claims the input type of "html". As with all custom input types, you can then use it from either propTypes:

MyComponent.propTypes = {
    propName: 'html'
};

Or you can use it from your C# entity fields:

[Data("type", "html")]
public string Description;

Or just straight from Input:

import Input from 'UI/Input';

..

<Input type='html' name='myField' label='My Field'/>