DisplayTemplate Image.cshtml is not getting called for pictures

DisplayTemplate Image.cshtml is not getting called for pictures inside TinyMCE (Xhtmlstring)

Vote:

We are in process of upgrading EPiServer ver.11 to Optimizely ver. 12.

The issue we are facing right now is that DIsplayTemplate (Image.cshtml) is not getting executed when picture is added in TinyMCE editor.

In EpiServer 11 we had this Image.cshtml html file inside the DisplayTemplates folder ->

@model ContentReference

@if (!ContentReference.IsNullOrEmpty(Model))
{
    var url = UrlResolver.Current.GetUrl(Model, null, new VirtualPathArguments { ContextMode = ContextMode.Default });
    var viewDataCssClass = ViewData["CssClass"];
    var cssClass = "img-responsive";
    if (viewDataCssClass != null)
    {
        cssClass += " " + viewDataCssClass;
    }

    <img class="@cssClass" src="@url" />
}

By this way we could add css class to images inside TinyMCE (Xhtml string).

Does anyone know whats the issue in Optimizely ver 12 or is there anyother way to add css classes to pictures/images residing inside TinyMCE ?

#301119

May 03, 2023 10:53

Scott Reed

Vote:

You can create a helper method you call whenever the XHtmlString is rendering. Then just loop through the fragments and find the one relevant to images and adjust the markup to add what you need. I've done this for similar things should as resonsive attributes and to add alt text from the core image

#301168

May 04, 2023 10:41

Try our conversational search powered by Generative AI!

DisplayTemplate Image.cshtml is not getting called for pictures inside TinyMCE (Xhtmlstring)