Changing Testimonial Carousel Arrows to Custom Image

Site URL: https://triceratops-snail-f7rs.squarespace.com/

Hi!

I'm trying to change the arrows on my testimonial carousel to a png image. I'll attach images of the arrows I want to use! Currently using Fluid Engine editor. Help! 🙂

Password for my website is letmein

For Our Collaborators section?

Yes!  The Our Collaborators section, exactly.

21 hours ago, zoearseneau said:

Yes!  The Our Collaborators section, exactly.

Add to Design > Custom CSS

[data-section-id="6319f7397da90e75b6aef53c"] {
svg.user-items-list-carousel__arrow-icon {
    display: none !important;
}
.user-items-list-carousel__arrow-icon-background.user-items-list-carousel__arrow-icon-background-area {
    background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/1773097810_Group12@2x.png.fd2d6dc749f79343ae687e29649cea4f.png);
    background-size: contain;
    background-repeat:no-repeat;
    background-position: center center;
}
button[class*="--right"] .user-items-list-carousel__arrow-icon-background.user-items-list-carousel__arrow-icon-background-area {
    background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/1753379866_Group13@2x.png.54c2b0e59adbe1a1f31f46b8b628398d.png);
}}

On 9/10/2022 at 9:00 AM, tuanphan said:

Add to Design > Custom CSS

[data-section-id="6319f7397da90e75b6aef53c"] {
svg.user-items-list-carousel__arrow-icon {
    display: none !important;
}
.user-items-list-carousel__arrow-icon-background.user-items-list-carousel__arrow-icon-background-area {
    background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/1773097810_Group12@2x.png.fd2d6dc749f79343ae687e29649cea4f.png);
    background-size: contain;
    background-repeat:no-repeat;
    background-position: center center;
}
button[class*="--right"] .user-items-list-carousel__arrow-icon-background.user-items-list-carousel__arrow-icon-background-area {
    background-image: url(https://content.invisioncic.com/p289038/monthly_2022_09/1753379866_Group13@2x.png.54c2b0e59adbe1a1f31f46b8b628398d.png);
}}

Awesome, thanks so much! Is there a way to remove the white circle behind it?

On 9/16/2022 at 12:04 AM, zoearseneau said:

Awesome, thanks so much! Is there a way to remove the white circle behind it?

Add this CSS

.user-items-list-carousel__arrow-icon-background.user-items-list-carousel__arrow-icon-background-area {
    background-color: transparent !important;
}