HasItemContainer was a specific property used on the EpiBootstrap plug-in created by Valdis, this plug-in is not compatible with CMS12 you will need to replace it with the one below. (Assuming you have not created your own ContentAreaRenderer)
https://github.com/valdisiljuconoks/optimizely-advanced-contentarea
Full Post : https://blog.tech-fellow.net/2023/01/23/optimizely-advanced-contentarea-render-is-back/amp/
You may want to keep a wrapping container for the block, but you can change it to be something semantic instead of a div element.
For the latest build I'm working on we are replacing the wrapping <div> with <section> and remove the outer container using this HtmlHelper extension method:
/// <summary>
/// Used for standard rendering of a <see cref="ContentArea"/>.
/// This will remove the outer container and change the wrapping element for blocks to use a section tag.
/// </summary>
/// <typeparam name="T">The Model for the page</typeparam>
/// <param name="htmlHelper">The generic html helper</param>
/// <param name="contentAreaFunction">A function expression to target the <see cref="ContentArea"/> on the Model</param>
/// <returns></returns>
public static IHtmlContent RenderContentArea<T>(this IHtmlHelper<T> htmlHelper, Expression<Func<T, ContentArea?>> contentAreaFunction)
{
return htmlHelper.PropertyFor(contentAreaFunction, new
{
HasContainer = false,
ChildrenCustomTagName = "section"
});
}
You can use below to remove extra div and need to inherit with ContentAreaRenderer
protected override void RenderContentAreaItem(IHtmlHelper htmlHelper, ContentAreaItem contentAreaItem, string templateTag, string htmlTag, string cssClass)
{
if (base.IsInEditMode() || base.ShouldRenderWrappingElement(htmlHelper))
{
base.RenderContentAreaItem(htmlHelper, contentAreaItem, templateTag, htmlTag, cssClass);
}
else
{
htmlHelper.RenderContentData(contentAreaItem.GetContent(), true, templateTag);
}
}
In the parent block I have this in the view file.
@Html.PropertyFor(m => m.MainContentArea, new { HasContainer = false, HasItemContainer = false })
But there is still an extra div around my child block. How can I remove that?