> For the complete documentation index, see [llms.txt](https://qodex.gitbook.io/shopify-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://qodex.gitbook.io/shopify-docs/theme-sections/collection-list-swiper.md).

# Collection List Swiper

{% hint style="success" %}
In the theme editor **(Customize) => Section**, Add **Collection list Swiper**
{% endhint %}

**Collection list Swiper** has **5 styles**

{% tabs %}
{% tab title="On Image" %}

<figure><img src="https://3542926515-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHqcWl0IcgFRM9gKakOEP%2Fuploads%2Frp644VMYpT2OTzEejEBw%2F153.jpg?alt=media&amp;token=b4b3279b-f22a-4791-801b-060b5ef6ac43" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Under Image" %}

<figure><img src="https://3542926515-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHqcWl0IcgFRM9gKakOEP%2Fuploads%2FR46OoVqcyN7X7Dvvg5xM%2F154.jpg?alt=media&amp;token=5456794f-4b7f-428a-b835-a02735112904" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Under Image (Sub Item)" %}

<figure><img src="https://3542926515-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHqcWl0IcgFRM9gKakOEP%2Fuploads%2Fjf6HTGp3X1SogejmlB6R%2F155.jpg?alt=media&amp;token=fd5d39d0-dee0-4187-885a-42044a2c680d" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

{% tabs %}
{% tab title="Button On Image" %}

<figure><img src="https://3542926515-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHqcWl0IcgFRM9gKakOEP%2Fuploads%2F1CGnmXXmO7AISqV7BCMM%2F156.jpg?alt=media&amp;token=861c0456-a293-407f-9c9d-037f0b694b83" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Arrow on Image" %}

<figure><img src="https://3542926515-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHqcWl0IcgFRM9gKakOEP%2Fuploads%2Fo23Swiafvx2n0aeI9xBf%2F157.jpg?alt=media&amp;token=b3c4663b-fa91-44d6-a0f9-a147ecbdfa3b" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### General Settings

![](https://3542926515-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHqcWl0IcgFRM9gKakOEP%2Fuploads%2Fd3wO7Zb4bfLQ3FQTuGN4%2F158.jpg?alt=media\&token=2f5a2909-c6ce-4997-8530-9681f87e3796)![](https://3542926515-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHqcWl0IcgFRM9gKakOEP%2Fuploads%2FYq3VwFuNWI2alC9yrN3X%2F159.jpg?alt=media\&token=2a95c668-8c88-449e-81bf-bc97c226cbb0)

* Select Animation
* Width of Container
* Background Section
* Text content, Sub Title, Heading, HTML/Description
* Align Heading
* Item
  * Style collection ( 5 styles )
  * Size Image Collection
  * Color
  * Background Overlay
  * Enable Gradient
  * Opacity Overlay
  * Size Name Collection
* Button Link, Button Text
* Carousel
  * Per View Desktop
  * Space Between
  * Wrap Box
  * Arrows
  * Scroll Bar
* Section Padding (Desktop on Mobile)

### Block Settings

{% hint style="success" %}
In **Collection list Swiper** Section **>** Add **Collection**
{% endhint %}

<figure><img src="https://3542926515-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHqcWl0IcgFRM9gKakOEP%2Fuploads%2FxeYi6wbK4p9d7qg2WXNW%2F160.jpg?alt=media&amp;token=7e94c993-1478-4383-8a62-1e81daff09b0" alt=""><figcaption></figcaption></figure>

* Select Collection
* Image (You can customize the image for each collection)