How to apply styles to sections of a blockgrid
# help-with-umbraco
o
We are making a new CMS site for a customer to replace their existing site. An existing example page is the following, which structurally can easily be replicated by a block grid and some 2/3/4 column layout areas. But the problem is this page is an example of some of the design magic the content editors would like to do where they want to apply styles that would cross over multiple grid items. This would be straightforward to do in a template, by adding custom multiple grids to the page, each having their own styles. But we do not want to create multiple templates just to support slightly different background colors etc. I tried to cheat by adding RTEs at the relevant points that just opened a div with the proper styling, and later a second RTE that closed the div, but it doesn't work because the grid encapsulates the injected HTML in its own structures that means the style does not affect the things in between. Is it possible to add a grid to a grid? where the child grid could have styles applied?
in particular on that example I'm talking about the rainbow gradient behind the faces, or the brick wall section
I suppose I could add a "one column" area that held the sytle, but there does not appear to be a way to add properties to be filled out to the area component itself? (If you can't tell, I'm fairly new to Umbraco)
hrm, maybe I can do that. Experimenting...
so it all works, until I try to render the page. then I get this InvalidOperationException: Model Umbraco.Cms.Web.Common.PublishedModels.OneColumn expects argument of type Umbraco.Cms.Core.Models.PublishedContent.IPublishedContent, but got Umbraco.Cms.Core.PublishedCache.PublishedElement.
so it seems like it doesn't like that I have an "area element" that also has properties
got this working.
hopefully my trail of woe is helpful to others with a similar goal!
The end answer : Make a "One Column" grid item that has a style/class property on it
2 Views