# Move Slideshow Thumbnails to left of image

**URL:** <https://community.elfsight.com/t/move-slideshow-thumbnails-to-left-of-image/65814>\
**Category:** Platform Tips\
**Tags:** squarespace\
**Created:** [August 15, 2024, 8:31am UTC](https://community.elfsight.com/t/move-slideshow-thumbnails-to-left-of-image/65814 "2024-08-15T08:31:07Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![tuanphan](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/tuanphan/32/3165_2.png) [@tuanphan](https://community.elfsight.com/u/tuanphan)\
**Post date:** [August 15, 2024, 8:31am UTC](https://community.elfsight.com/t/move-slideshow-thumbnails-to-left-of-image/65814/1 "2024-08-15T08:31:07Z")

</div>

To move slideshow thumbnails to left of image in Squarespace, you can do these.  
**#1.** First, [find the ID of the Slideshow](https://forum.squarespace.com/topic/305813-share-find-id-of-a-block/).

In my example, we will have:

```auto
section[data-section-id="66b558355d5793599c7f117c"]

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/e/e/ee2ca97e7a31ca915c5f1e27233536d5e5cdffc7.png)

**#2.** Use this code to Custom CSS box

```auto
@media screen and (min-width:768px) {
section[data-section-id="66b558355d5793599c7f117c"] {
.gallery-slideshow[data-thumbnails="true"] {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
}
.gallery-slideshow-thumbnails {
    width: 30% !important;
}}}

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/d/2/d29f3106da08b97f40d994ad3d99979c17cafd93.png)