Customize Lightbox Gallery/Gallery Box

First of all: Why different names? Called “Lightbox Gallery” in plugins catalog, but “Gallery Box” in the builder? :slight_smile:

I’ve finally managed to create a masonry gallery with iterable images from the CMS, with help from both the devs and this community! :heart: Now I need to customize the look of the lightbox when viewing the gallery. First I would like the box to fill the viewport, and preferably an option to go full screen :slight_smile: However, I need to view the images lager then how they are represented on the page.

I’ve tried to edit the CSS code by just creating the same class for i.e “swiper-button-prev” and set the color value to !important - but not adding it to any div or so. I added a tag for any object in the builder to create the class since I got an error by trying to use “Create class” feature.
Error I got was:

“IN data error. ‘tag’ is passed as ‘string’ while expecting ‘boolean’.”

Anyway, it didn’t work - and now I have no clue on how to modify the look of the box :slight_smile:

Any ideas? :grin:

following… :grinning: I’m currently stuck on the same issue.

How did you get the Masonry grid to work? It hasn’t worked for me so far.

Checkout this post, this is exactly what I used :slight_smile:

Got it. This is done with CSS. However, this isn’t the true masonry layout as shown in the screenshot. :grin: This approach works well when the order of the items doesn’t need to strictly follow a left-to-right sequence. But this is often the case when telling a story with a series of images, like for wedding images.

If I remember correctly is going down from top left and continues at top in next column. There are probably ways of doing it in a specific order as well. I’m doing a site with wedding images now, and it works for me :slight_smile:

If you don’t mind, would you show how you solved it? I have a large wedding website currently built with Webflow (www.miandla.com)but am working on a product webpage that I’d like to create with Divhunt. And there i’m using now also a Image-Gallery.

What is it that you don’t manage to solve that you want me to show? :slight_smile: My galleries are going from top left, downwards and then continue in the next column going downwards and so on. I have 3 columns. They are not going from left to right.

Maybe @dejan know how to make them go from left to right instead of from top to bottom?

As far as I know, there is currently no native CSS support for Masonry. There is a new CSS specification, but it is practically unsupported in any current browser.

Well, we all know it’s doable. There are tons of Wordpress Plugins doing exactly this so… :slight_smile:

I will take some time in few days and create a plugin for masonry. Hopefully there is some good js library for that.

1 Like

Very appreciated! :star_struck: Would be great to be able to customise some things like sorting order, even custom order for 100% control when doing stroytelling with images? I don’t really know what else you would want to include in the plugin since it’s “only” a way of listing a table :slight_smile:

Really looking forward to it! :grin::sparkler::tada:

that would be great. but no hurry. :slight_smile:

i’ve used in the past the library from here:
https://masonry.desandro.com
there is also a cdn for the script.

Besides the masonry script, he has some other really good stuff to play with.

btw: Happy New Year! :dizzy:

Btw, I tried creating this plugin, I invested like 4-5 hours, but all libraries are big sh** honestly. :confused: When I get more time, after a marketplace and website launch, I will try to create masonry from scratch.

1 Like

It’s awesome that you don’t give us shit just to deliver :grin: I rather wait a little to get something good/great/awesome instead of dealing with :poop: :joy:

OH, sorry to hear that. I had a good experience using the above masonry script directly in Webflow. But I’d rather wait a bit longer than deal with any :poop: :crazy_face:.

This looks interesting: MiniMasonry.js

Hi there Pakic,

I am aware you guys are super busy and that this is probably not a high priority item. That said, do you have any update on Masonry grid feature? Also would really like to see more “gallery” items in the wireframes section, it would make building out regular galleries HEAPS easier for photographer and other artists/creatives!

Thanks :slight_smile:

1 Like

Hi,

bumping up the topic. It would be useful to be able to customize the lightbox, e.g. background, add an “X” button, change the color of the arrows, etc.

Also annoying is that the photos that are not displayed are transparent which gives a not cool effect.

Thanks in advance