taylahroberts1 Posted December 20, 2022 Share Posted December 20, 2022 Hey! I want to add a text overlay (different pieces of text for each image) to a full bleed gallery slideshow (autoplay with no arrows) — I've been searching this forum all day but haven't found a definitive answer yet. I tried the slideshow with the text and the arrows and added a code injection on the header to autoplay the gallery. However, the client did not like that the image "slid" to the next once VS. how it is now (cutting to the next image without any sliding). I'm hoping there's a simple solution to this, as it seems many people have been asking for this for years! Thanks a bunch 🙂 For reference, here is the URL: https://anabezi.squarespace.com/Password: ana123 Link to comment
tuanphan Posted December 20, 2022 Share Posted December 20, 2022 Enable Options: Captions then edit each image text will appear under slideshow share link to page where you use slideshow, we can give code to move it over image Or You can consider using List Section Banner Slideshow. It has all options Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
taylahroberts1 Posted December 20, 2022 Author Share Posted December 20, 2022 Hi @tuanphan, I've added the captions now, is there a way to make them larger, move them up and to the left of the page and then remove the black bar at the bottom? Thank you! It's for the gallery at the opening (with the overlay of the navigation and logo). Here is the URL: https://anabezi.squarespace.com/home password: ana123 Link to comment
Solution tuanphan Posted December 22, 2022 Solution Share Posted December 22, 2022 On 12/20/2022 at 11:58 PM, taylahroberts1 said: Hi @tuanphan, I've added the captions now, is there a way to make them larger, move them up and to the left of the page and then remove the black bar at the bottom? Thank you! It's for the gallery at the opening (with the overlay of the navigation and logo). Here is the URL: https://anabezi.squarespace.com/home password: ana123 Add to Design > Custom CSS body#collection-639bcaa9e249ef08743e64b2 { figcaption.gallery-caption.gallery-caption-fullscreen-slideshow { top: 50%; left: 0; text-align: left; max-width: 90%; } figcaption.gallery-caption.gallery-caption-fullscreen-slideshow * { font-size: 30px; } .gallery-fullscreen-slideshow { margin-bottom: 0px !important; }} Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
taylahroberts1 Posted December 22, 2022 Author Share Posted December 22, 2022 Thank you so much @tuanphan! This worked perfectly. What CSS would need to be added to change the text size for mobile only? Link to comment
tuanphan Posted December 24, 2022 Share Posted December 24, 2022 On 12/22/2022 at 11:23 PM, taylahroberts1 said: Thank you so much @tuanphan! This worked perfectly. What CSS would need to be added to change the text size for mobile only? Adjust code to this body#collection-639bcaa9e249ef08743e64b2 { figcaption.gallery-caption.gallery-caption-fullscreen-slideshow { top: 50%; left: 0; text-align: left; max-width: 90%; } figcaption.gallery-caption.gallery-caption-fullscreen-slideshow * { font-size: 30px; } .gallery-fullscreen-slideshow { margin-bottom: 0px !important; } /* mobile size */ @media screen and (max-width:767px) { figcaption.gallery-caption.gallery-caption-fullscreen-slideshow * { font-size: 20px; }}} Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment