Jump to content

Ishimoto: Change size/color/background color of control arrows in Gallery Page?

Recommended Posts

  • 10 months later...
  • Replies 2
  • Created
  • Last Reply
  • 3 weeks later...


Here is the Costom CSS code for the Gallery.If you want to change the color or transparency just ad the code and change the following line.

background: rgba(0, 0, 0, .5);



.collection-type-gallery.gallery-controls-arrows .gallery-controls .gallery-next,.collection-type-gallery.gallery-controls-arrows .gallery-controls .gallery-prev { position: absolute; top: 50%; margin-top: -30px; width: 42px; height: 60px; line-height: 60px; font-size: 20px; background: rgba(0, 0, 0, .5); color: #fff; vertical-align: middle; text-align: center; font-weight: normal; font-style: normal; font-family: 'squarespace-ui-font'; speak: none; -webkit-font-smoothing: antialiased; -webkit-transition: all 100ms cubic-bezier(.25, .46, .45, .94); -moz-transition: all 100ms cubic-bezier(.25, .46, .45, .94); -ms-transition: all 100ms cubic-bezier(.25, .46, .45, .94); -o-transition: all 100ms cubic-bezier(.25, .46, .45, .94); transition: all 100ms cubic-bezier(.25, .46, .45, .94);}

Link to comment


This topic is now archived and is closed to further replies.

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.