Jump to content

Pop-up Video from clicking on a thumbnail in a photo gallery

Recommended Posts

Site URL: https://www.nickpagephotography.com/landscapes

I like the way Nick Page has used Squarespace to produce this page: https://www.nickpagephotography.com/landscapes It`s a wall of photo thumbnails which I find really artistic. But it`s just a still photo gallery. Do you think Squarespace or perhaps a plug-in within Squarespace could be used to do the same for video ie produce a pop-up video (Vimeo) upon clicking on an image in a "wall of images"? Most embedded videos are obviously video links with a play button. But I like the clean look of a pure image thumbnail. Perhaps the play button could only be made to appear when scrolling over the image?
Thanks.
Ian

Link to comment
  • Replies 7
  • Views 1.8k
  • Created
  • Last Reply
3 hours ago, Swarbrick said:

Site URL: https://www.nickpagephotography.com/landscapes

I like the way Nick Page has used Squarespace to produce this page: https://www.nickpagephotography.com/landscapes It`s a wall of photo thumbnails which I find really artistic. But it`s just a still photo gallery. Do you think Squarespace or perhaps a plug-in within Squarespace could be used to do the same for video ie produce a pop-up video (Vimeo) upon clicking on an image in a "wall of images"? Most embedded videos are obviously video links with a play button. But I like the clean look of a pure image thumbnail. Perhaps the play button could only be made to appear when scrolling over the image?
Thanks.
Ian

are you on squarespace 7.0 or 7.1 template

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment
1 hour ago, Swarbrick said:

Neither I`m enquiring at the pre-purchase stage.

Check the help article

Setting images to open in a lightbox – Squarespace Help

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment

There is this also, one of Paul's responses .

You may want to retain the play button but move it above the titles so that visitors realise a video will play. To do this, add the following to Design > Custom CSS:

.collection-type-gallery .video-play-icon {
  bottom: 33%;
}

play-icon.png.a7b003e0cfa7423c9bd75a45e9d5304c.png

 

If you prefer to remove the icon, use this instead:

.collection-type-gallery .video-play-icon {
  display: none;
}
Link to comment
  • 2 weeks later...
On 2/9/2021 at 10:09 PM, myburket said:

I am trying to achieve exactly what was described in the initial comment in 7.1 and was unable to even figure out the lightbox option in the gallery blocks in 7.1.  Can you describe in more detail how this can be achieved?

Hi. You want

Clicking on Gallery Item >> Lightbox will appear?

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

Link to comment

Archived

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.