> For the complete documentation index, see [llms.txt](https://wplake.gitbook.io/advanced-views/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wplake.gitbook.io/advanced-views/field-types/layout/group-field.md).

# Displaying Group field

The Group field type provides a way to structure fields into groups. It assists in better organizing the edit screen UI, as well as the data. In contrast to the [Repeater field](/advanced-views/field-types/layout/repeater-field.md), the Group field always consists of a single row.&#x20;

Advanced Views Pro natively supports the following group types:

1. [ACF](/advanced-views/fields/meta-plugins/advanced-custom-fields.md): any Group field
2. [MetaBox](/advanced-views/fields/meta-plugins/meta-box-fields.md): any Group field (with repeatable option disabled)

{% hint style="warning" %}
Pay attention: the Group field is supported only in [Advanced Views Pro](https://advanced-views.com/pro/).&#x20;
{% endhint %}

## 1. How to display a Group field

1. [Create a new *Layout*](/advanced-views/getting-started/first-layout.md)
2. Add any Group field
3. Choose target subfields in the SubFields tab
4. Save the *Layout*, copy its [embedding shortcode](/advanced-views/layouts/embedding-shortcode.md)
5. Embed *Layout*: paste the shortcode inside the target place

Advanced Views automatically creates HTML markup for every subfield and loads them into the template. You can [customize the *Layout* template](/advanced-views/layouts/code-fields/custom-template.md) to change the output.

## 2. Nested Groups

{% hint style="success" %}
Advanced Views Pro supports nested groups with no restrictions on the depth of nesting.&#x20;
{% endhint %}

To display a nested group, follow these steps:

1. **Create the Parent Layout**:
   * Go to the *Layouts* section and create a new 'Parent' *Layout*.
   * Select the target group field in the Fields tab and save the *Layout*.
2. **Create the Child Layout**:
   * Create another *Layout*, this will be the 'Child' *Layout*.
   * In the 'Parent Group' field of this *Layout*, choose the target group field that is nested within the Parent Layout and save the *Layout*.
3. **Configure the Parent Layout**:
   * Open the 'Parent' *Layout*.
   * In the group field settings of the Parent Layout, select the 'Child' *Layout* you just created from the Field Layout setting and save the Parent Layout.

That’s it! You can now use the 'Parent' *Layout* wherever needed, and it will display both the outer group fields and the nested inner group.&#x20;

You can further customize the template and add CSS/JS as usual. Note that the 'Child' *Layout* is designated for internal use only and cannot be used directly on pages or posts.

{% hint style="info" %}
To add another depth level, simply repeat the steps outlined above, treating the 'Child' Layout as the new parent for the next level of nesting.
{% endhint %}
