> 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/relational/taxonomy-field/render-options.md).

# Taxonomy field render options

By default, Advanced Views [displays the Taxonomy field](/advanced-views/field-types/relational/taxonomy-field.md) as term link(s). You can [customize the *Layout* template](/advanced-views/layouts/code-fields/custom-template.md) to change how it's rendered:

## 1.  Hierarchical terms 

By default, all the items displayed in the same order, in which were selected in the field. If your taxonomy supports hierarchy, and you want to reflect it on the front, you can group the items by the parent\_id field. 

See the Twig template example below.

```twig
<acf-view-65ae6721b4917 class="{{ _layout.classes }}avf-layout avf-layout--id--{{ _layout.id }} avf-layout--object-id--{{ _layout.object_id }}">

    {% if taxonomy.value %}
        <div class="avf-layout__taxonomy">
            {% for term_item in taxonomy.value %}
                {% if 0 == term_item.parent_id %}
                    [acf_views view-id="{{ taxonomy.view_id }}" object-id="term" term-id="{{ term_item.value }}"]

                    {% set children = [] %}

                    {% for inner_term_item in taxonomy.value %}
                        {% if term_item.value == inner_term_item.parent_id %}
                            {% set children = children|merge([inner_term_item]) %}
                        {% endif %}
                    {% endfor %}

                    {% if children %}
                        <div class="children">
                            {% for child_term_item in children %}
                                [acf_views view-id="{{ taxonomy.view_id }}" object-id="term" term-id="{{ child_term_item.value }}"]
                            {% endfor %}
                        </div>
                    {% endif %}
                {% endif %}
            {% endfor %}
        </div>
    {% endif %}

</acf-view-65ae6721b4917>
```

{% hint style="info" %}
Note: the template above expects that you've filled the Field Layout setting to get the detailed item information, but you can use the same approach with utilizing the 'parent\_id' field even when you display items just as links.  &#x20;
{% endhint %}

## 2. Terms Slider (Pro) <a href="#id-3.-displaying-users-slider-pro" id="id-3.-displaying-users-slider-pro"></a>

Advanced Views comes with a [set of pre-configured JS libraries](https://docs.advanced-views.com/display-content/front-end-assets-management-pro), so you can easily turn the term items into a slider. Before activating the slider feature, read the 'displaying term details' section to learn how to setup the details look for each item.

{% hint style="info" %}
**Note:** The Slider option is available only for Taxonomy fields that support multiple values. If the Taxonomy field’s appearance setting is configured to disallow multiple selections, the Slider option will not appear in the field settings.
{% endhint %}

After adding the Taxonomy field to the target *Layout*, change the 'Enable Slider' option to 'Splide v4' and Save. It'll automatically change the field markup to incorporate the necessary classes, and add the default JS instance:

```javascript
var term_items = this.querySelector('.avf-layout__terms');
if (term_items) {
	/* https://splidejs.com/guides/options/ */
	new Splide(term_items, {
		type: 'loop',
		perPage: 1,
		perMove: 1,
	}).mount();
}
```

You can customize it according to your needs, using any available [Splide options](https://splidejs.com/guides/options/).