# Sections

## Sections

Each `li-settings` tag needs to be enclosed within a section. For this purpose, use the `li-section` tag, which can be applied to your Webflow sections. You have the flexibility to choose a name for it, with a maximum limit of 30 characters.

{% code title="Webflow" fullWidth="false" %}

```
li-section = Section Name
```

{% endcode %}

{% columns %}
{% column %}

<figure><img src="/files/aT2BBeByRZH10m4hUrDr" alt=""><figcaption></figcaption></figure>
{% endcolumn %}

{% column %}

<figure><img src="/files/n5mnFtPsdvS5uRqCS93Q" alt=""><figcaption></figcaption></figure>

{% endcolumn %}
{% endcolumns %}

#### Section Categories

For a better overview in the Shopify Editor, you can add a section to a category by adding the attribute li-section:category. The value of this attribute will then be the name of the category.

{% code title="Webflow" fullWidth="false" %}

```
li-section:category = Category Name
```

{% endcode %}

<figure><img src="/files/gM3DUldWuU9MMt7cUxDC" alt=""><figcaption></figcaption></figure>

## **Section Groups**

[Section groups](https://shopify.dev/docs/storefronts/themes/architecture/section-groups) are typically used for the header and footer. They are JSON data files that define a list of sections and app blocks along with their settings. Merchants can add, remove, and reorder these sections within the theme editor.

Simply add the `li-section-group` attribute to a `<div>` element and place your sections inside it — for example, the Navigation section.

{% code title="Webflow" fullWidth="false" %}

```
li-section-group = Section Group Name
```

{% endcode %}

{% hint style="warning" %}

* Section groups are not allowed inside the `li-content-for-layout` element
* Section groups cannot have the same name as other section
* Changes made to the section group will be reflected on all pages where the group is used
  {% endhint %}

To define the type of a section group, use the `li-section-group:type` attribute. This helps Shopify determine where the section group is used. Accepted values:

* `header`
* `footer`
* `aside`
* A custom type, in the format `custom.<name>`, where `<name>` is a unique identifier for your section group type.

{% code title="Webflow" fullWidth="false" %}

```
li-section-group:type = header
```

{% endcode %}

## **Enable or disable Sections in the Shopify Editor**&#x20;

**Enable**: If you want to show certain sections only on specific templates, you can use the tag modifier `li-section:on_templates`. In the value, list all the templates where the section should be shown, separated by commas. To show the section on all templates, just use `*`.

See the official [Shopify documentation](https://shopify.dev/docs/storefronts/themes/architecture/sections/section-schema#enabled_on) for more information on this topic.

{% code title="Webflow" %}

```
li-section:on_templates = page, product
```

{% endcode %}

You can do the same for section groups using the tag modifier. To target all groups, just use `*` in the value.

{% code title="Webflow" %}

```
li-section:on_groups = footer, header
```

{% endcode %}

**Disable**: If you want to hide certain sections on specific templates, use the tag modifier `li-section:off_templates`. List the templates (comma-separated) where the section should be hidden. To hide the section on all templates, use `*` in the value.

See the official [Shopify documentation](https://shopify.dev/docs/storefronts/themes/architecture/sections/section-schema#disabled_on) for more information on this topic.

{% code title="Webflow" %}

```
li-section:off_templates = page, product
```

{% endcode %}

You can do the same for section groups using the tag modifier. To target all groups, just use `*` in the value.

{% code title="Webflow" %}

```
li-section:off_groups = footer, header
```

{% endcode %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.liquiflow.app/section-settings/sections.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
