Using the Bootstrap grid's "container -> row -> span" pattern in C5?

One of the main reasons we use Twitter bootstrap is the framework's excellent support for grids in your layout. The pattern that repeats all the time is that you open a container div, which contains row divs, which contain span divs.

This allows you to construct pages that are like stacks of pancakes. A page may have multiple containers (imagine an edge-to-edge full-width container section) and then fixed-width containers. Each container may have multiple rows, and each row may have multiple spans.

Now, if I understand C5 correctly, the best place for content blocks would be either to be wrapped in bootstrap's rows or spans. I'd love to be able to create a "container block" that I could add "row blocks" into, and then I'd add "span blocks" into each of them. Since C5 blocks cannot contain other nested blocks, however, this structure seems to be a pipe dream.

Has anyone given any thought to how to let users leverage the bootstrap grid fully inside C5? Is there a way I haven't understood to let users place blocks into a containment hierarchy, so they could add rows and spans as they wish?

This would be a killer feature for Concrete5, but without it the power of the bootstrap grid seems to be very hard to pass along to typical end users. I'd love to hear about any strategies you have tried or ideas you have that would let us take better advantage of the bootstrap grid system.


View Replies:
JohntheFish replied on at Permalink Reply
Because this is bootstrap specific, such a tight integration with bootstrap layout is unlikely to become part of c5. c5 uses bootstrap for the dashboard. But the front end needs to support any css famework.

However, there is a 'grid' feature planned for c5.7 (have a look at the roadmap pages).

If you want tight integration with bootstrap layout, it is something that will have to come from the actual theme developers who build bootstrap based themes.
dzone replied on at Permalink Reply
Thanks for your reply, John.

I suspect that the requirement for nested elements is going to be present no matter what form of grid framework is supported. Certainly Bootstrap and Zurb Foundation both expect this, as does the more conventional 960px grid pattern. While support for their specific container->row->span semantics may be too tightly coupled to Bootstrap, the abstraction of this nested containment is likely to be present in any reasonable grid implementation.

I'll try to find out the status of the upcoming 5.7 grid support, and maybe it'll have a solution, but I'll be surprised if grids of any type can be richly supported without the introduction of some level of nesting.