Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Gallery Reel Slideshow Change Arrows


AllanYung

Question

I would like to change the Gallery Reel slideshow arrows across the entire website for 7.1. This can be either to a specific image or something similar to the image attached.

Also, would it be possible to make them fade in and out? If not, no problem as long as I can change them.

I've tried the code from three other posts in this forum from last year but none of those have worked.

right-arrow.png

Link to comment

2 answers to this question

Recommended Posts

  • 0
7 hours ago, AllanYung said:

I would like to change the Gallery Reel slideshow arrows across the entire website for 7.1. This can be either to a specific image or something similar to the image attached.

Also, would it be possible to make them fade in and out? If not, no problem as long as I can change them.

I've tried the code from three other posts in this forum from last year but none of those have worked.

right-arrow.png

try this

.gallery-reel-control-btn-icon svg {
  display: none;
}
.gallery-reel-control-btn-icon {
  background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='1000' viewBox='0 0 1000 1000' width='1000' xmlns='http://www.w3.org/2000/svg'><path d='M767.9,499.9L291.6,10l-59.4,61.3l416.6,428.7L232.1,928.7l59.5,61.3L767.9,499.9z'/></svg>");
    background-repeat: no-repeat;
    background-size: cover;
}
[data-previous] .gallery-reel-control-btn-icon {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
}

image.thumb.png.7efc8332a0adb29a23723bb3431bf14b.png

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Portfolio hover Replace Link Style
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
22 hours ago, bangank36 said:

try this


.gallery-reel-control-btn-icon svg {
  display: none;
}
.gallery-reel-control-btn-icon {
  background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='1000' viewBox='0 0 1000 1000' width='1000' xmlns='http://www.w3.org/2000/svg'><path d='M767.9,499.9L291.6,10l-59.4,61.3l416.6,428.7L232.1,928.7l59.5,61.3L767.9,499.9z'/></svg>");
    background-repeat: no-repeat;
    background-size: cover;
}
[data-previous] .gallery-reel-control-btn-icon {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
}

image.thumb.png.7efc8332a0adb29a23723bb3431bf14b.png

This worked perfectly! Thanks so much!

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...