Content generated in the XHTML Editor is different from standard text because the XHTML Editor adds markup. If we want the markup to display correctly, we need to use a special HTML helper: Html.Raw. Without this helper, HTML tags generated by the XHTML Editor will be treated as literal text instead of processed as markup.

The code below uses the Html.Raw helper to display the value of the BodyCopy element.

@{
    var bodyCopy = Model;
    if (bodyCopy != null) 
    {
    <div @_Helpers.RenderICEAttribute(Model) class="main-text">
    @Html.Raw(@Model.Value)
</div>
    }
}

In this code block, we declare a bodyCopy variable, check to see if the variable is null, and use the Html.Raw method to display the body-copy content without escaping the markup.

Let's walk through the process of displaying an XHTML element, using the copyright text in the footer of our MVC site as an example. We want to display copyright info and a link to Ingeniux in the footer. For example:

2021 © Ingeniux Corporation, All Rights Reserved.

In the cutup, the copyright information and Ingeniux tag are hardcoded in tags.

<p>2021 &copy; Ingeniux Corporation, All Rights Reserved.</p>

In our SiteControl schema, we've created an XHTML element, CopyrightInfo, to hold the copyright data.

<CopyrightInfo type="dhtml" label="CopyrightInfo" readonly="false" hidden="false" required="false">    
      <p>2021 &copy; Ingeniux Corporation. All Rights Reserved.</p>
</CopyrightInfo>

We need to replace the hard-coded values with logic that renders the XHTML element. The markup for the content is generated by the XHTML editor, so we'll delete the "p" tags and declare a variable that uses the GetElementValue method to retrieve the content (markup and all) from the element. Then we use the HTML.Raw helper to render the display.

@{        
   var copyright = Model.GetElementValue("CopyrightInfo");        
   @Html.Raw(copyright)
}