Streaming live at 10am (PST)

Standard E-Commerce Product Zoom on Mouse Over or similar effect

Is this planned and considered for release for E-Commerce? To view a product by zooming into the image (image enlarges in the div container) on mouse hover or something similar to show images in this way in higher rez? Yes I know about the CMS’ current lightbox feature but is there one with a zoom? Aswell as to preview different hd images by clicking different product thumbnails? Alternative options for detail view which would be really great using a much easier drag and drop widget process than custom coding.

Ray

Hey @Lucius_Blackheart - that’s not on our shortlist at the moment, but building out a widget library in the add panel for that and similar ecommerce-specific elements is something that’s been discussed.

The best move in the immediate term is to file that request in the ecommerce category of our wishlist so we make sure that idea doesn’t get lost in the shuffle, and so that we can compare demand for that with other features in our pipeline.

Thanks!

1 Like

Will do this is a necessary feature for e-commerce apparel and accessories products.

R

Here it is! Added to wish list and letting everyone know about this especially if you will be selling apparel or accessory products online that need detailed shots of images.

https://wishlist.webflow.com/ideas/WEBFLOW-I-1601

2 Likes

Thanks Lucius! Agree, would be great to have this.

1 Like

Hey @Lucius_Blackheart,

You can do that with some interactions easily.

Here’s an example:
https://preview.webflow.com/preview/product-zoom-834368?utm_source=product-zoom-834368&preview=e89264d7976b3cfd3b4ac82915f75218

If you need more help let me know. Have a great day

2 Likes

Thanks gilson. It is definitely but was looking forward to a drag and drop process because I would need to set this up to work with other thumbnails.
I appreciate this working solution!

R

Here’s a demo I made to achieve this effect:

Live: http://supreme-e.webflow.io/

Showcase (clone): https://webflow.com/website/eCommerce-Product-Image-Zoom

5 Likes

This came out perfect! Super clean!

1 Like

Thanks all for the tips! Appreciate them. They work!

R

This is quite a bit to do to set up a zoom function for your product pages. I was thinking of just using a normal lightbox widget however I discovered you can’t bind the lightbox to your collection list. Lightbox product images will need to be setup manually.

Is there a solution for Lightbox widget to call your collection product list? Is it on the team’s to do list? This feature would be great and simple.

L

I know it’s late for a response, but if anyone is wondering this video shows how to implement a dynamic lightbox: https://www.youtube.com/watch?v=6PR8EXiMVso

Thanks on the zoom effect, cheers!

You can get image zoom easily with https://sirv.com/features/image-zoom/