Understand the Page Builder hierarchy
- In Kentico’s Page Builder, a page → contains sections → which contain widgets
- Sections can have their own properties (like your background color)
- Widgets don’t automatically know about section properties — you have to pass them down explicitly
Pass section property to the widget view model
-
In your section’s view component, when you render widgets, you can pass additional data (like the background color) to the widget’s view.
public class MySectionViewComponent : ViewComponent
{
public IViewComponentResult Invoke(SectionViewModel sectionModel)
{
// Expose background color to widgets
ViewData["BackgroundColor"] = sectionModel.BackgroundColor;
return View(sectionModel);
}
}
Then in your widget view:
@{
var backgroundColor = ViewData["BackgroundColor"]?.ToString();
var textColor = backgroundColor == "dark" ? "white" : "black";
}
`<div style="color:@textColor">
@Model.Text
</div>
Note: You can refer to the Kentico Xperience 13 Dancing Goat website code for section properties (1-column section).