Multiple content areas per page

by

I’m having a complex content issue. Each page can have multiple sections (unknown number), each section can have multiple containers, each container can have multiple content blocks (either 1, 2 or 3).

I’ve currently got a theoretical solution with shortcodes, but I would like to solve this with the UI if possible by providing wysiwyg editors for each content block.

Sections: There can be any number of sections (a realistic/acceptable maximum would be 10).
Containers: A section can contain any number of rows (a realistic/acceptable maximum would be 5).
Containers: A row must know how many columns it needs to contain.
Content blocks: A row can contain 1, 2 or 3 columns.

The shortcode solution looks something like this:

[section id="summary"] //id is required but can be anything (no spaces)
   [container blocks="1"] //row can have 1, 2 or 3 columns
      [block]
      .content-block
      [/block]
   [/container]
[/section]
[section id="find us"] //id is required but can be anything (no spaces)
   [container blocks="3"] //row can have 1, 2 or 3 columns
      [block]
      .content-block
      [/block]
      [block]
      .content-block
      [/block]
      [block]
      .content-block
      [/block]
   [/container]
[/section]
[section id="team"] //id is required but can be anything (no spaces)
   [container blocks="2"] //row can have 1, 2 or 3 columns
      [block]
      .content-block
      [/block]
      [block]
      .content-block
      [/block]
   [/container]
[/section]

Does anyone have any suggestions on how I can go about this?

Thanks,
Josh

2 Answers
2

This sounds to me like a perfect use of Advanced Custom Fields “flexible content” feature to me. Flexible content fields allow you to define multiple layouts, and then add them to a page or post one by one, in any order or combination you need. Each layout can be a combination of text fields, images, wysiwyg editors, and other field types.

It’s a brilliant UI on the client side, and easy to build a custom front-end in your template once you get the hang of it.

It’s a premium plugin, but I’ve been building these kinds of interfaces for many years and it works really well. I haven’t found anything else quite like it.

Leave a Comment