Configure the Group Field

This article explains what the Group field is and how to configure it in the Custom Type builder.


The Group field is used to create a repeatable collection of fields. You can use the Group field to create an image gallery, a banner, a list of products, a navigation list, and more.

For example, for a price table, you could create a Group that contains one field for the item name and another field for the item price. The user can repeat the group for every item.

Screenshot of the group field in the drag-and-drop Custom Type editor.

Nested Groups

Nested Groups are not possible. You cannot put a Group field inside a Group field, nor can you put a Group field inside the repeatable zone of a Slice.

The visual builder

When configuring a Group field you'll see the options to set the Field name and API ID.

Screenshot of a group field in the Custom Type editor.

JSON model

The following table displays the JSON configuration options available in the JSON editor.

type
string (required)

Value must be Group

config

object

Object for the configuration options

config.fields

object (required)

Defines the fields in the group with their optional configuration. Set up each field as described in their respective references.

config.label

string

The label that shows up for the field in the document editor

config.repeat

boolean

If set to false it configures the group as not repeatable.

Example JSON configuration

The following JSON defines a Group field with external links with a label for each link:

Copy
"example_group" : {
  "type" : "Group",
  "config" : {
    "fields" : {
      "link_label" : {
        "type" : "Text",
        "config" : {
          "label" : "Link Label",
          "placeholder" : "Add a label for the link..."
        }
      },
      "link" : {
        "type" : "Link",
        "config" : {
          "label" : "Link",
          "placeholder" : "Add an external link"
        }
      }
    },
    "label" : "Related Links"
  }
}

API response example

Below you can see the API response example of a Group field with the API ID of example_group with a Key Text and a Number Field:

Copy
// API response example of a Group field

{
  // ...
  "example_group":[
    {
      "key_text_description":"Lorem",
      "number_price":55
    },
    {
      "key_text_description":"Ipsum",
      "number_price":60
    }
  ]
}

Was this article helpful?
Not really
Yes, Thanks

Can't find what you're looking for? Get in touch with us on our Community Forum.