11 Feb 2015, last update: 30 Jan 2022
Multi / Single line Text with HTML in Sitecore
There are a lot of difference between Sitecore versions and how to use HTML in a single line or a multi line text field. This could be an issue when upgrading Sitecore.
In Older Sitecore 6 versions you can use HTML tags in Text field but if the are not encoded you could lose the tags in the page editor.
In 6.6 Update-3, the <renderField> pipeline was modified to HTML encode the field value when rendering single-line text fields (ref. no. 327905). Previously you couldn't configure types of the fields to apply this logic to.
This has been fixed in Sitecore 7.2 update 3 and Sitecore 7.5 update 1 by adding a new Rendering.HtmlEncodedFieldTypes setting to the Web.config file that specifies a pipe-separated list of field types that should be HTML encoded when rendered by the <renderField> pipeline. (384680)
<!-- RENDERING - HTML ENCODED FIELD TYPES
Specifies a pipe-separated list of field types that should be HTML encoded when rendered by the <renderField> pipeline.
Default value: text|single-line text
-->
<setting name="Rendering.HtmlEncodedFieldTypes" value="text|single-line text" />
The Rendering.HtmlEncodedFieldTypes setting is at the moment not available in Sitecore 8 update 1.
Using HTM in non Rich Text field
A solution is to patch the pipeline:
<processor type="Sitecore.Pipelines.RenderField.GetTextFieldValue, Sitecore.Kernel" />
Create a custom Single Line Html Text Field in Sitecore
Or another approach is to use a custom data field. Leave the normal field to Sitecore default behavior and only the special field have a custom behavior, in this case the might contain HTML.
First we create the code for a new Data Field from the Text Data type, Not the Rich Text we want the UI from the Single Line Text. At this point we don’t changes the behavior, but if we want we have a place to do. (it is optional and not strictly needed)
using Sitecore.Shell.Applications.ContentEditor;
namespace Mirabeau.Sitecore.Data.Fields
{
class SingleLineHtmlText: Text
{
}
}
In the core database
Copy the:
/sitecore/system/Field types/Simple Types/Single-Line Text
To
/sitecore/system/Field types/Simple Types/ Single-Line HTML Text
And fill in the class and Assembly
Now you can use this new Single-Line HTML Text in your Templates. In MVC it work also in the experience editor also known as the page editor. (not sure of it work for all Sitecore versions, find it out and tell it to me than can i add it to this article)
In Webforms the page editor will remove the HTML tags on a save.
For .NET Webforms we create a custom Field Renderer.
using System.Web;
using Sitecore.Diagnostics;
using Sitecore.Web.UI.WebControls;
namespace Mirabeau.Website.Controls.ExtendedControls
{
/// <summary>
/// To have a single / multi line Html text it needs to tdecode in the page editor
/// For the renderer we encode it again to be able plain html input to the content editor and encoded html in the page Editor.
/// </summary>
public class HtmlText : FieldRenderer
{
protected override void DoRender(System.Web.UI.HtmlTextWriter output)
{
Assert.ArgumentNotNull(output, "output");
if (string.IsNullOrEmpty(this.FieldName))
{
return;
}
string fieldValue = Item[this.FieldName];
string fieldCheck = fieldValue.ToLower().Trim();
if (Sitecore.Context.PageMode.IsPageEditor)
{
//only < and > to prevent double encoded
fieldValue = fieldValue.Replace("<", "<").Replace(">", ">");
}
else
{
fieldValue = HttpUtility.HtmlDecode(fieldValue);
}
this.OverrideFieldValue(fieldValue);
output.Write(this.RenderField().ToString());
}
}
}
And use the Custom Renderer in the Layout and the Page editor can handle or new Single Line Html Text Field.
<%@ Register TagPrefix="mira" Namespace="Mirabeau.Website.Controls.ExtendedControls" Assembly="Mirabeau.Website" %>
<html>
<body>
<mira:HtmlText runat="server" ID="TitleMayContainHtml" Field="title" />
</body>
</html>
Related links
Sitecore FieldRenderer output differences between CMS 6.5 and 7.0
