Jump to content

[Share] Move caption over Gallery Reel Image

Recommended Posts

Posted

To make caption over Gallery Reel Images, you can follow these.

image.png.b5a65b0d32b583738217e29c05a6a776.png

#1. First, edit Gallery Reel and enable Captions

image.png.9f95bb5737c7d3126dffc960abc4f6d3.png

You will see something like this

image.png.ce3410c37311752ba865f9fecd2c45e4.png

#2. Use this code to Custom CSS box to move caption over images

figcaption.gallery-caption.gallery-caption-reel {
    opacity: 1 !important;
    visibility: visible !important;
    position:absolute;
    top: 50%;
    left:50%;
    transform: translate(-50%,-50%);
    margin: 0 !important;
    height: auto !important;
}

image.png.37e72e7b17097034096f5a540f51e6a1.png

Result

image.png.b5a65b0d32b583738217e29c05a6a776.png

#3. If you want to apply it for specific gallery reel, you can find Reel ID.

image.png.11f722cd615a531cfc55033f35865777.png

Then use CSS code like this

section[data-section-id="66d41e080d7e43167a4dadad"] figcaption.gallery-caption.gallery-caption-reel {
    opacity: 1 !important;
    visibility: visible !important;
    position:absolute;
    top: 50%;
    left:50%;
    transform: translate(-50%,-50%);
    margin: 0 !important;
    height: auto !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

  • Replies 0
  • Views 836
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Create an account or sign in to comment

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

×
×
  • 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.