Jump to content

Pinch to zoom for pictures in Lightbox mode on desktop and mobile Squarespace 7.0 & 7.1

Recommended Posts

Trying to find a plugin or code in order to allow an image to be zoomed in on when in lightbox like in the screencaptures below. Please note the scale to zoom at the top of the lightbox image. Any ideas? If you know how to write the code for this, please let me know.
Jim

 

 

Lightbox Zoom 100.png

Lightbox Zoom Enlarged.png

Brand design across print and digital media including marketing communications and website design.

Link to comment

It still blows my mind to think that in 2023 Squarespace does not have a method to natively allow users to "pinch to zoom" in on images for either desktop or mobile when viewing images in the "Lightbox" mode.

This ability has been ironed out over a decade ago on every other website from Craigslist to Facebook and when watching people use my website they naturally try to do this move an are dismayed when they cannot. It reflects poorly on my services when basic web moves like zooming in on an image cannot be done. What is the point of Lightbox then??

As a provider of websites for millions of people I expect Squarespace to have the basic features of the modern web experience available but they are not.

Anyways, if anyone is looking to enable this functionality I cannot recommend the plugin by Beyondspaces which I will link below.

https://www.beyondspace.studio/pinch-zoom-lightbox

I am not involved or affiliated with this plugin at all but feel the absolute need to post this because it is so frustrating to watch clients and users want to zoom in on images and not be able to and then have Squarespace not implement this feature for years.

This plugin is easy to install and does exactly what you want across every device and browser I have witnessed.

/End rant

Link to comment
On 4/29/2023 at 3:33 AM, Lumenarius said:

It still blows my mind to think that in 2023 Squarespace does not have a method to natively allow users to "pinch to zoom" in on images for either desktop or mobile when viewing images in the "Lightbox" mode.

This ability has been ironed out over a decade ago on every other website from Craigslist to Facebook and when watching people use my website they naturally try to do this move an are dismayed when they cannot. It reflects poorly on my services when basic web moves like zooming in on an image cannot be done. What is the point of Lightbox then??

As a provider of websites for millions of people I expect Squarespace to have the basic features of the modern web experience available but they are not.

Anyways, if anyone is looking to enable this functionality I cannot recommend the plugin by Beyondspaces which I will link below.

https://www.beyondspace.studio/pinch-zoom-lightbox

I am not involved or affiliated with this plugin at all but feel the absolute need to post this because it is so frustrating to watch clients and users want to zoom in on images and not be able to and then have Squarespace not implement this feature for years.

This plugin is easy to install and does exactly what you want across every device and browser I have witnessed.

/End rant

Thanks for the kind words @Lumenarius! I did not expect to get a thoughtful review on a forum post!

The plugin has evolved a lot since your last purchase, our new Lightbox Studio has a tons of upgrades for your lightboxes:

1. Support zoom using gesture and toolbar buttons, as well as mouse wheel scroll

2. Download button to get the hi-res image (2500w) from Squarespace CDN, this was add-on feature but now is integrated into the plugin

3. Support different designs so you can choose to fit your current look&feel

4. Showing thumbnails in the gallery

5. The plugin has a dedicated editor so you can choose among the features to add into the main plugin

PS: Your dedicated editor URL can be found at:

https://beyondspace-showcase.squarespace.com/lightbox-studio?noredirect&snapshot=production&package=lightbox-studio&websiteUrl=www.lumenarius.com/the-herald-projection-mapping-bellingham-waspacer.png

 

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

I have developed a plugin that support the zoom feature on image, unfortunately it did not support the zoom slide out of the box, are you okay with the plus sign icon toolbar or it has to be a zoom slider?

https://beyondspace-showcase.squarespace.com/lightbox-studio?noredirect&snapshot=production&package=lightbox-studio&utm_source=forum&utm_medium=support

spacer.png

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 month later...

@Beyondspace Just seeing this for the first time and very intrigued. My site is image-heavy, and I used to use the classic Fancyapps/Fancybox lightbox, which I loved. The one main benefit that Squarespace doesn't offer was full-size images (esp. on non-blog pages... so much padding) -- and certainly not the ability to zoom in.

Anyway, this looks good (though the installation makes me nervous). I'm assuming this is good for any gallery; masonry, strip, grid etc?

Thx!

Edited by adsausage
Link to comment
On 6/7/2023 at 9:03 AM, adsausage said:

@Beyondspace Just seeing this for the first time and very intrigued. My site is image-heavy, and I used to use the classic Fancyapps/Fancybox lightbox, which I loved. The one main benefit that Squarespace doesn't offer was full-size images (esp. on non-blog pages... so much padding) -- and certainly not the ability to zoom in.

Anyway, this looks good (though the installation makes me nervous). I'm assuming this is good for any gallery; masonry, strip, grid etc?

Thx!

Do you mind to share your current site URL so I can have a look?

Btw, the installation process is just a matter of point and click, you don't have to know any coding at all!

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
  • 2 weeks later...
14 minutes ago, Tankgurl said:

@BeyondspaceI just purchased your plugin but I don't see how to install it for a personal squarespace account, not a business one. 

I don't have this:

From Squarespace admin screen, go to
Settings / Advanced / Code injection / Footer

Please help, I really need to get this working.

Thanks.

 

 

Please invite me as admin collaborator to support

What's your order number please?

Thanks

Edited by Beyondspace

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
  • 7 months later...

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.