Global Fields as Blocks within Modular Blocks

You can refer to a Global field as a block within a Modular Blocks field while creating a content type. This helps developers avoid having to recreate complex data structures frequently. They can simply reuse different content schemas across several Modular Blocks.

Additional Resource: Learn how using Modular Blocks fields within Global fields also makes life easier while creating content types.

Consider a scenario where you want to provide flexibility to store owners by allowing them to reuse different content structures across product pages for an e-commerce site. This means that when creating product pages for their website, the store owners can either refer to the product details of a clothing brand, footwear brand, or a mobile brand as per their need and in quick time.

To achieve this, you need to first create three Global fields: “Clothes Store”, “Footwear Store”, and “Mobile Gallery”. Within the first Global field, add the following fields:

• Single Line Textbox field (for the Clothing Brand)
• Rich Text Editor field (for the Clothing Description)
• File field (for the Apparel Image)

Within the “Footwear Store” Global field, add the following fields:

• Single Line Textbox field (for the Footwear Brand)
• Multi Line Textbox field (for the Footwear Description)

Within the “Mobile Gallery” Global field, add the following fields:

• Reference field (for the Mobile Brand)
• Single Line Textbox field (for the Mobile Model Name)
• Rich Text Editor field (for the Mobile Description)
• File field (for the Mobile Image)

Now, create a content type. For the first section of your page, add a Modular Blocks field, and add three blocks within it: “Clothes”, “Footwear” and “Mobiles”. For the first block (i.e., Clothes), refer to the “Clothes Store” Global field to use its content schema. For the second block, (i.e., Footwear), refer to the “Footwear Store” Global field to use its content structure. Subsequently, refer to the “Mobile Gallery” Global field in the third block (i.e., Mobiles).

Similarly, for another section on your webpage, add a Modular Blocks field within the same content type and add a block within it. For this block (i.e., Recently Viewed Mobiles), refer to the “Mobile Gallery” Global field. Save this content type.

Now, while creating entries for this content type, store owners can choose to mix and match the products they display on their product pages by choosing between apparel, footwear, or mobiles multiple times. Also, at the same time, store owners can help customize their site pages per visitor by providing references to previously viewed products.

Let us look at how developers can use Global fields as blocks of a Modular Blocks field.

Use Global Fields as Blocks of Modular Blocks

To use the Global field as a block within a Modular Blocks field of a content type, log in to your Contentstack account, go to your stack, and perform the following steps:

1. Click the “Content Models” icon on the left navigation panel and select the Content Type for which you want to use Global fields as Blocks of Modular blocks.
2. Click on the “Insert a field” icon and select the Modular Blocks field from the Fields list displayed in the floating menu.
   

   Note: Developers can add up to 5 Modular Blocks fields in a content type.

3. Once added, click on the + New Block button and select Add Global Field.
4. From the Select Global Field dropdown, select Clothes Store. Provide a name of your choice for this block (e.g. Clothes), and click on Create.
   You will notice that the Clothes Store Global field has been added to your Modular Blocks field as a block along with the required sub-fields.
   

   Note: When you add a Global field to your Modular Blocks field, each Global field counts as a single level of nesting.

5. Now, you can add multiple blocks and have them refer to different Global fields (for example, Footwear Store or Clothing Store).

Note: You can add a maximum of 25 Global fields in a content type. Check out other limitations of Global fields.