Join the Webstudio community

Updated 4 weeks ago

Adding an Image Gallery

How can you add an image gallery?
M
c
J
9 comments
Do you have an example of what you need when you speak of image gallery?
Like in an ecom store.
One big image and small images on the right that become the big image when clicked
2 ways :
  1. Maybe you could use swiper JS
  2. You make your own component
(i tried the last one. the code is working on a single HTML page, but it's not working on Webstudio... don't know why. Will make update if I can manage to work with it)
Attachment
SCR-20240909-nspm.jpeg
@cramses.

All right then. It works right now.

Here is the link to make the same component (which can be improve of course).

https://p-7a49fc8c-2bf7-4c27-9673-aa3baa475bdd.apps.webstudio.is/?authToken=f3759971-639f-4f41-ae16-5c576d90240a&mode=preview

You will see that there is an html embed with the code.

You just have to copy paste.

Improvement : src for the image has to come from a CMS. Right now in this example they are static. So make them dynamic.

@John Siciliano I don't know if a component like that could interest the community?
we accept community contributions πŸ˜‰
btw working on the baserow template as we speak
I don't know how I can publish a (little) component like for the community?

(P.S. : I gonna make template for the community when the variables CSS will be finish I cannot wait!!)
It would be a template in the Marketplace
Thank you Milan!
Add a reply
Sign up and join the conversation on Discord