Making Carousel Images Clickable without adding a button at the bottom

Site URL: https://oriole-watermelon-57s3.squarespace.com/plus-plus-plus

Hello, I'd like to make the images on the carousel a clickable link. Is there a way to do that? I can't seem to find the option to. Help will be appreciated, thank you!

https://oriole-watermelon-57s3.squarespace.com/plus-plus-plus

Hi. The url doesn't exist. Can you check it again?

Hi tuanphan, it's back up. Sorry about that!

On 6/6/2022 at 1:23 AM, bdn5834 said:

Hi tuanphan, it's back up. Sorry about that!

You can add buttons, then we can make image clickable + make buttons invisible then.

Hi @tuanphan I am trying to make my carousel images clickable and hide the buttons under the images. Would you be able to help me accomplish that?

On 10/3/2023 at 10:20 PM, tdc-kristin said:

Hi @tuanphan I am trying to make my carousel images clickable and hide the buttons under the images. Would you be able to help me accomplish that?

You can share link to page where you added carousel, then we can give exact code for your case

You can also use this code (Website Tools (under Not Linked) > Custom CSS) but it will apply to all carousels

li.list-item {
    position: relative;
}
.list-item-content__button-container {
    position: static;
}
a.list-item-content__button.sqs-block-button-element {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    color: transparent !important;
    background-color: transparent !important;
    border: none !important;
}
.list-item-content__button-container {
    position: static !important;
transform: unset !important;
}
a.list-item-content__button.sqs-block-button-element:before {
    visibility: hidden;
}
.user-items-list-carousel__slide {
    pointer-events: initial !important;
    user-select: unset !important;
}
.user-items-list-carousel__gutter {
    cursor: pointer;
}