Build Nested Data Structures with Embedded Modular Blocks

Contentstack now allows nesting of modular blocks. This means that developers can, while creating content types, add Modular Blocks within a Modular Block field. This provides content managers with the flexibility to create deeply nested data structures without the need to engage a developer for changes in the content type structure.

Modular Blocks Overview

Modular Blocks is a field that allows content managers to dynamically create and modify components of a page or app on the go.

While creating content types, a developer can add various blocks (a group of fields) within a Modular Block field. For example, ‘Banner’ block (Single-line Textbox and Image fields), ‘Product Details’ block (Title, RTE, and Image fields), or ‘Video’ block (File and Multi-line Textbox fields). Content managers can then, while creating entries, select the required block or multiple blocks from these options, move blocks up or down, and remove them as and when required.

This offers content managers the flexibility to create dynamic and rich pages, without needing developers’ help for changes in the content type structure. Read more about Modular Blocks.

What’s New: Nested Modular Blocks

Previously, nesting was not possible with the Modular Blocks field. This meant that having a Modular Block as a choice for a field in another Modular Block was not possible.

With the latest release, it’s now possible. This gives more depth to the flexibility of Modular Blocks, and more power to content managers.

Developers can add up to 5 Modular Blocks in a content type, and add up to 20 blocks within each Modular Block field, with the max limit of total fields being 100 for each content type. Only one level of nesting is allowed for the Modular Blocks field. This means that you cannot add a Modular Block field to a Modular Block that is already a part of a Modular Block field. Learn more about the limitations of Modular Blocks.

Let’s look at an example to understand this well.

You want to offer flexibility to news authors by providing page structures that allow them to create either standard news articles or submit a set of photos. Further, when creating standard news articles, there should be flexibility in the usage of images, image description and body content as required.

To achieve this, you can create a content type by adding a Modular Blocks field, and add two blocks within it: “Standard News Article” and “Image Gallery”. Within the first block (i.e., Standard News Article), add another (nested) Modular Blocks field, and add a block each for the following fields: ‘File’, ‘Single Line Textbox’ and ‘Rich Text Editor’. For the “Image Gallery” Modular Blocks field, add a ‘File’ field and mark it as Multiple. Save this content type.

Now, while creating entries for this content type, news authors can choose between ‘Standard News Article’ format or the ‘Image Gallery’ format. Further, they can create varieties of Standard News Articles by adding any of the three given fields anywhere in the page multiple times.

Another example where Nested Modular Blocks could be used is a super menu navigation of a website where each of the submenus contain a different dropdown structure.

Additional Resources

Log in to your Contentstack account and try adding a Nested Modular Blocks field to your content type to check out its flexible use cases. For more information, refer to the links below:

• Modular Blocks Field
• Add Nested Modular Blocks to Content Types