> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/triumph/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mpithemes.gitbook.io/triumph/template/sections.md).

# Sections

Sections from the current group can be used almost on each page of a store.

{% hint style="success" %}
Click the '**Sections**' icon in the top-left corner of the settings panel to manage sections.
{% endhint %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2F74hH36Rwy1nNjeLHlKl2%2Feditor_sections.png?alt=media&amp;token=cfecf171-de9f-4833-949c-844566144172" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
&#x20;In the '*Template*' section group, press the '**Add section**' button and select a desired section from the list.
{% endhint %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FIHo8CexS15zktf70qh7N%2Feditor_add%20section.png?alt=media&amp;token=5b14d567-2e60-4b1a-aace-bf7eab9d97d1" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Any dynamic section can be removed or hidden by hovering over its title to reveal the trash or eye icons and pressing the corresponding icon.&#x20;
{% endhint %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2Foa29zxPCMTyl6HL20it7%2Feditor_remove%20section.png?alt=media&amp;token=4d6145c7-0d96-46ed-8ab9-68b3e802be8a" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Additional section settings can be viewed by pressing the section, then hitting the three dots \[...] button at the top.
{% endhint %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2Fxa1S5qW5yY8B6OAxQpuT%2Feditor_section%20options.png?alt=media&amp;token=46bcf3e0-4238-4b89-a555-df3dd4b52611" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Dynamic sections can include up to three levels of blocks. To view additional blocks, press the arrow next to the section name to open a drop-down and hit the '**Add block**' button. Then, select a block from the proposed list.
{% endhint %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FUa2VrN1pegs9XGIrquvD%2Feditor_add%20block.png?alt=media&amp;token=e27abfde-3ec9-4696-b3df-796258026007" alt=""><figcaption></figcaption></figure>

***

### Customizable sections

Using the provided sections helps you build a more engaging and flexible storefront without needing technical skills. They make it easy to highlight products, promote offers, share your brand story, and organize content to guide customers through your store. By combining different types of sections, you can create a more dynamic shopping experience, keep your site fresh, and improve how customers discover and interact with your products.

#### Banners

Use banner sections to quickly grab attention.\
They’re great for promotions, announcements, or highlighting key messages with strong visuals.

* [<mark style="color:$primary;">Banners carousel</mark>](/triumph/template/sections/banners-carousel.md)
* [<mark style="color:$primary;">Collage</mark>](/triumph/template/sections/collage.md)
* [<mark style="color:$primary;">Slideshow</mark>](/triumph/template/sections/slideshow.md)
* [<mark style="color:$primary;">Slideshow vertical</mark>](/triumph/template/sections/slideshow-vertical.md)

***

#### Blog

Use blog sections to share updates, stories, or helpful content.\
This helps keep your store fresh and can build trust with your audience.

* [<mark style="color:$primary;">Blog posts</mark>](/triumph/template/sections/blog-posts.md)
* [<mark style="color:$primary;">Featured blog posts</mark>](/triumph/template/sections/featured-blog-posts.md)

***

#### Collections

Use the collection section to showcase groups of products (like “New Arrivals” or “Best Sellers”) and make it easier for customers to browse.

* [<mark style="color:$primary;">Collection list</mark>](/triumph/template/sections/collection-list.md)

***

#### Forms

Use forms to collect information from customers - like contact requests, sign-ups, or feedback.\
It’s a simple way to stay connected.

* [<mark style="color:$primary;">Contact form</mark>](/triumph/template/sections/contact-form.md)
* [<mark style="color:$primary;">Newsletter signup</mark>](/triumph/template/sections/newsletter-signup.md)

***

#### Offers

Use offer sections to highlight discounts, special deals, or limited-time promotions and encourage customers to take action.

* [<mark style="color:$primary;">Call to action</mark>](/triumph/template/sections/call-to-action.md)
* [<mark style="color:$primary;">Countdown timer</mark>](/triumph/template/sections/countdown-timer.md)
* [<mark style="color:$primary;">Discount coupon</mark>](/triumph/template/sections/discount-coupon.md)

***

#### Products

Use product sections to feature specific items you want to promote, such as popular products or new releases.

* [<mark style="color:$primary;">Bundle products</mark>](/triumph/template/sections/bundle-products.md)
* [<mark style="color:$primary;">Featured collection</mark>](/triumph/template/sections/featured-collection.md)
* [<mark style="color:$primary;">Featured collection: Grid</mark>](/triumph/template/sections/featured-collection-grid.md)
* [<mark style="color:$primary;">Featured collection: Loop</mark>](/triumph/template/sections/featured-collection-loop.md)
* [<mark style="color:blue;">Featured collection: Tabs</mark>](/triumph/template/sections/featured-collection-tabs.md)
* [<mark style="color:$primary;">Featured product</mark>](/triumph/template/sections/featured-product.md)
* [<mark style="color:$primary;">Products collage</mark>](/triumph/template/sections/products-collage.md)
* [<mark style="color:$primary;">Products list with banner</mark>](/triumph/template/sections/product-list-with-banner.md)
* [<mark style="color:$primary;">Social shop feed</mark>](/triumph/template/sections/social-shop-feed.md)

***

#### Storytelling

Use storytelling sections to share your brand’s story, values, or mission.\
This helps create a stronger emotional connection with customers.

* [<mark style="color:$primary;">Image with text: Grid</mark>](/triumph/template/sections/image-with-text-grid.md)
* [<mark style="color:$primary;">Image with text: Tabs</mark>](/triumph/template/sections/image-with-text-tabs.md)
* [<mark style="color:$primary;">Map</mark>](/triumph/template/sections/map.md)
* [<mark style="color:$primary;">Media collage</mark>](/triumph/template/sections/media-collage.md)
* [<mark style="color:$primary;">Media gallery</mark>](/triumph/template/sections/media-gallery.md)
* [<mark style="color:$primary;">Media horizontal scroll</mark>](/triumph/template/sections/media-horizontal-scroll.md)
* [<mark style="color:$primary;">Media vertical scroll</mark>](/triumph/template/sections/media-vertical-scroll.md)
* [<mark style="color:$primary;">Reviews</mark>](/triumph/template/sections/reviews.md)
* [<mark style="color:$primary;">Scrolling logo</mark>](/triumph/template/sections/scrolling-logo.md)
* [<mark style="color:$primary;">Video</mark>](/triumph/template/sections/video.md)

***

#### Text

Use text sections for simple content, such as descriptions, announcements, or additional information, without heavy design elements.

* [<mark style="color:$primary;">Accordion</mark>](/triumph/template/sections/accordion.md)
* [<mark style="color:$primary;">Contact info</mark>](/triumph/template/sections/contact-info.md)
* [<mark style="color:$primary;">Icons with text</mark>](/triumph/template/sections/icons-with-text.md)
* [<mark style="color:$primary;">Page</mark>](/triumph/template/sections/page.md)
* [<mark style="color:$primary;">Rich text</mark>](/triumph/template/sections/rich-text.md)
* [<mark style="color:$primary;">Scrolling text</mark>](/triumph/template/sections/scrolling-text.md)
* [<mark style="color:$primary;">Tags</mark>](/triumph/template/sections/tags.md)

***

#### Vendors

Use vendor sections to highlight brands or suppliers you work with, helping customers discover products by brand.

* [<mark style="color:$primary;">Vendors list</mark>](/triumph/template/sections/vendors-list.md)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://mpithemes.gitbook.io/triumph/template/sections.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.