Calling all developers! We invite you to provide your input on Feature Experimentation by completing this brief survey.
Calling all developers! We invite you to provide your input on Feature Experimentation by completing this brief survey.
You need to scan and replace the HtmlFragment. Checking if it's an image and then loading the alt text and replacing it. I've knocked up a demo no alloy that works, just use this extension instead of ToHtmlString when to get the string of the XHtmlStirng for your ViewModel / In View. Replace the namespace in this extension class with whatever your project is.
using System.Text;
using System.Web.Mvc;
using EPiServer;
using EPiServer.Core;
using EPiServer.Core.Html.StringParsing;
using EPiServer.Web.Routing;
using FrontEnd.Models.Media;
namespace FrontEnd.Business
{
public static class HtmlStringExtensions
{
/// <summary>
/// Parses the XhtmlString for Image tags and sets them to lazy load
/// </summary>
public static string FormatHtmlString(this XhtmlString html)
{
var stringBuilder = new StringBuilder();
var altText = string.Empty;
foreach (var htmlFragment in html.Fragments)
{
var value = htmlFragment.GetViewFormat();
if (htmlFragment is UrlFragment urlFragment)
{
if (!string.IsNullOrWhiteSpace(urlFragment.InternalFormat))
{
var content = UrlResolver.Current.Route(new UrlBuilder(htmlFragment.InternalFormat));
if (content is ImageFile imageData)
{
altText = imageData.Description;
}
}
}
else
{
if (value.Contains("alt=") && !string.IsNullOrWhiteSpace(altText))
{
var indexOfAlt = value.IndexOf("alt=\"") + 5;
var startString = value.Substring(0, indexOfAlt);
var restOfString = value.Substring(indexOfAlt);
var closingIndex = restOfString.IndexOf("\"");
var endString = restOfString.Substring(closingIndex);
value = startString + altText + endString;
altText = string.Empty;
}
}
stringBuilder.Append(value);
}
return stringBuilder.ToString();
}
}
}
Hi Team,
We added the image(Below ImageFile) in media and drag and dropped the image in the XHTML string editor. The problem is the image "alt" value is the name image file by default.
.
How to use the "Description " property value as the image "alt" value in the editor when drag and drop an image?