Jump to content

Recommended Posts

Posted

Hi guys,

 

I've added an instagram feed to my website but wondering if there's a way I can have the captions underneath each photo instead of over the photo as standard?

Photo below - would ideally like this not covering the photo.

 

image.png

Posted

Can you share your website URL and this page?

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

📈 SEO Space (Referral link)
Ⓜ️ 
Will Myers' Plugins & Tutorials (Referral link)
 🔌 Ghost Squarespace Plugins (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲SQSP Themes (Referral link) 
Spark Plugin (Referral link) 
 🖼️Pinch-to-Zoom Gallery Lightbox Plugin (Referral link) 

 Did I help? Buy me a coffee?

Posted
12 hours ago, molliehiggi said:

If thre's a way to share an unpublished page with you I can?

Yes, add a page password and enable it, then share that page password (available in the page settings,)

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

📈 SEO Space (Referral link)
Ⓜ️ 
Will Myers' Plugins & Tutorials (Referral link)
 🔌 Ghost Squarespace Plugins (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲SQSP Themes (Referral link) 
Spark Plugin (Referral link) 
 🖼️Pinch-to-Zoom Gallery Lightbox Plugin (Referral link) 

 Did I help? Buy me a coffee?

Posted
On 3/5/2024 at 2:50 AM, molliehiggi said:

Either underneath or between - just so you can see the caption and the photo fully 🙂

Use this code to Website > Website Tools > Custom CSS
 

.sqs-gallery-thumbnails {
    margin-top: 150px !important;
}
.sqs-gallery-block-slideshow .slide.loaded .meta {
    z-index: 10000 !important;
    bottom: -150px !important;
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    margin-left: 0 !important;
    top: unset !important;
}
.sqs-gallery-design-stacked-slide {
    overflow: visible !important;
}

You can adjust 150px and -150px in the code

150px is space above thumbnails

-150px is move text to bottom

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!)

Posted
On 3/10/2024 at 10:52 PM, molliehiggi said:

Sorry - me again.

 

On the website mobile version I can't see an option at all? 

 

page available under saame password 🙂

Use this code under

@media screen and (max-width:991px) {
.sqs-gallery-block-slideshow .slide.loaded .meta {
    display: block !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!)

  • 3 weeks later...
Posted

Hi, I used the code but for some reason the captions still aren't showing?

On 3/14/2024 at 3:29 AM, tuanphan said:

Use this code under

@media screen and (max-width:991px) {
.sqs-gallery-block-slideshow .slide.loaded .meta {
    display: block !important;
}
}

 

 

  • 3 weeks later...
Posted

Hi Tuanphan,

 

If you are able to have another look that would be great:

https://www.ypha.org.uk/

Our Story --> news

Password is: Squarespace1

 

In an ideal world (if possible) I'd like the captions to be under the photo, and then the thumbnails move in accordance with the length of the caption, making it the same for mobile viewing too.

 

For some reason, some captions are working properly, and others are just one long line that and the text doesn't wrap

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.