> For the complete documentation index, see [llms.txt](https://docs.acpt.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.acpt.io/integrations/bricks-builder/working-with-slider-nestable-and-gallery-field.md).

# Working with Slider (Nestable) and Gallery field

Learn how to make the ACPT Gallery work with the Nestable Slider block

Slider (Nestable) is one of the Bricks builder core blocks.

It allows the user to create a slider with nested elements like text and buttons.

The ACPT Gallery field can be used to fill the slider images.

### How to make the ACPT Gallery work with a nestable slider

Drag a nestable slider to the canvas to work with the ACPT Gallery field *(notice that three blank elements are automatically added)*.

Now click on the **Slide 1** element, and select the background property in the style tab.

Choose the gallery field, like this:

{acpt\_movie\_box\_gallery}

<figure><img src="https://3235524095-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fiyf0tSKPgXiyoQ3zV3I6%2Fuploads%2Fgit-blob-87e4247bcf1ebc5af051685cf3856a01b79df4c8%2FSchermata%20del%202024-07-01%2010-36-05.png?alt=media" alt=""><figcaption></figcaption></figure>

The FIRST image is pulled out from the gallery.

Now move to the second slider element (**Slide 2**) and do the same.

In this case, pull the SECOND image from the gallery in this way:

{acpt\_movie\_box\_gallery:1}

<figure><img src="https://3235524095-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fiyf0tSKPgXiyoQ3zV3I6%2Fuploads%2Fgit-blob-70fff15f22ec3d59444ba50290dad61f5a2d1356%2FSchermata%20del%202024-07-01%2010-36-11%20(2).png?alt=media" alt=""><figcaption></figcaption></figure>

Indeed, the ACPT gallery field **allows the user to display a single image specifying its index**.

The count starts from 0, so the second element has 1 as the index (not 2). If no index is specified, the first image is pulled out.

Finally, do the same for the THIRD element (**Slide 3**):

{acpt\_movie\_box\_gallery:2}

<figure><img src="https://3235524095-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fiyf0tSKPgXiyoQ3zV3I6%2Fuploads%2Fgit-blob-dde0732bee50b869b6ce0c94abe4d141cd498ac7%2FSchermata%20del%202024-07-01%2010-36-14.png?alt=media" alt=""><figcaption></figcaption></figure>

Repeat the process for all the elements of your slider.
