How to make list of objects in Netlify CMS using list and object Widget


Here in this Netlify CMS tutorial we will how easily we can make a list of objects using list and object widgets. This will allow us to add multiple objects to the list.

To create an object field in the list field we need to use the object widget inside the list widget. A widget in Netlify CMS means the data type or the interface of the entry fields. Netlify comes with several in-built widgets that you can check here: NetlifyCMS Widgets

Here we will create an example of the FAQ section of a website. Follow the steps to create the list of objects for your site.

Step 1: Open the config.yml file of your project.

Step 2: Create the fields as below:

 - label: FAQS
        name: faqs
        widget: list
        fields: 
          - label: FAQ
            name: faq
            widget: object
            fields:
              - { label: Question, name: question, widget: string, default: "Question" }
              - { label: Answer, name: answer, widget: string, default: "Answer" }

Here we have used is the list widget with the name 'faqs' and then inside it, we have created another field 'faq' which is an object widget.

The object widget has two fields of string widget, one for the question and the other for the answer. You can specify default values for both fields as you like.

Step 3: Once done with the config.yml file, you can build the project to see the change in your Netlify Dashboard.

That's how you can create a list of objects in your netlify cms.


💾 Recommended Articles