ecochrane Posted October 29, 2019 Share Posted October 29, 2019 Hi there, I'm looking to style a blog grid so that the title/subtitle text appears as an overlay on top of the photo. Right now I'm setting it up as a series of individual "poster" images. Is there a better way to do this / an easy setting I just need to change? I'd prefer to use something like a blog or gallery block if I could change the text. I've attached a screenshot showing the default blog layout vs what I'm hoping to achieve. Thanks, Emma Link to comment
ecochrane Posted October 29, 2019 Author Share Posted October 29, 2019 Update! It looks like a "portfolio overlay grid" element might work, in case anyone else is looking to do this. Link to comment
TimCc Posted June 25, 2022 Share Posted June 25, 2022 Has anyone been successful in achieving this on a SS7.0 site? Or know a work-around/CSS solution? I'm attempting to achieve this on a Canson site 🤔 Link to comment
tuanphan Posted June 30, 2022 Share Posted June 30, 2022 On 6/25/2022 at 5:54 PM, TimCc said: Has anyone been successful in achieving this on a SS7.0 site? Or know a work-around/CSS solution? I'm attempting to achieve this on a Canson site 🤔 If you share link to blog page on your site, we can give code to achieve this 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
TimCc Posted July 5, 2022 Share Posted July 5, 2022 On 7/1/2022 at 8:37 AM, tuanphan said: If you share link to blog page on your site, we can give code to achieve this Thanks @tuanphan! Link is https://tcooperphoto.com/frames/ Cheers Link to comment
tuanphan Posted July 5, 2022 Share Posted July 5, 2022 30 minutes ago, TimCc said: Thanks @tuanphan! Link is https://tcooperphoto.com/frames/ Cheers Add to Design > Custom CSS a.BlogList-item-title { position: absolute; top: 50%; z-index: 9999; width: 100%; text-align: center; color: white; } article.BlogList-item { position: relative; } .Blog-meta.BlogList-item-meta { position: absolute; top: calc(~"50% + 30px"); width: 100%; text-align: center; } 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
TimCc Posted July 5, 2022 Share Posted July 5, 2022 You are truly magical @tuanphan, Thanks so much! 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