Thank you so much for your help, setting background-color solved it! I had changed .jig-caption-wrapper height because I didn’t want so much whitespace under the captions with little text, but I’ve set it now to 90px as a compromise so that it doesn’t look too bad and longer captions are visible (to reduce whitespace I’ve also decreased margin-bottom). But yes, it would be great to have a max height instead of fixed!

Since JIG for now uses floats, if there were uneven caption heights, things would fall apart so it’s not as easy as tweaking a few CSS properties. Furthermore, since everything is or will be positioned by knowing the dimensions of elements, adding the measurement of text in to the mix is another complexity, but I’ll figure something out.

Yes, you’re absolutely right, this does seem like a very difficult thing to implement. In its current form JIG is still the best gallery plugin out there in my opinion so thanks a lot for your hard work. Any other functionalities will be a cool bonus but I love it the way it is!

Hi, your images do come from a CDN, the host is like i0.wp.com which means Jetpack plugin’s image module (Photon) is active. It’s probably better than TimThumb the default thumbnail creation, but it does mean the special effects are not working because of a remote origin. There are workarounds but they are not implemented in the plugin.

What effect would you like to use? Perhaps they can be replacicated with CSS.

Hi, sorry for the late reply. You were right, I didn’t realize Jetpack image optimization was on and turning the option off solved the problem. I was trying to get the images to desaturate and show colors only on hover by the way. Is there an easy way to get that effect with CSS?

Thank you!

A quick something, Custom CSS:

.justified-image-grid img {
    filter: grayscale(1);
    transition: filter 1s;
}
.justified-image-grid .jig-imageContainer:hover img {
    filter: none;
}

JIG, Overlay effects, first few settings control that color layer. A hiccup when combined with pure CSS stuff can happen because of the JS-based animation in JIG plays the entire animation from off/on/off even when briefly crossing an item with the mouse. With CSS the transitions immediately return toward off state. JIG’s is a bit more playful and resemble the classic Flash sites’ mouse effects.

Yellow is that CSS does: http://www.2meter3.de/code/hoverFlow/ Orange is what JIG has.

Ok, captions work again using Chrome. But they still don’t appear using Edge. Maybe there’s a problem just with it.

I could not reproduce the problem in any of my browsers with your site. Has this been resolved by any chance?

Hello Fresh, I finally fixed it. The problem was due to an Edge extension. Thank you for your help.

Freezing the GIF relies on JIG’s own thumbnail creation as it alters the source image (actually just breaks the animation). Unfreezing makes it use the original image as-is. I was not aware that Jetpack can do something with the GIFs so they don’t appear frozen, regardless if their resize was successful. So this freezing was only tested or meant to be used without Jetpack. I’ll support more cloud resizers/CDNs but I likely have no control over what they do with animated GIFs, unfortunately. What could be better if the freeze functionality didn’t rely on thumbnail creation actually breaking the image, but if the first frame was extracted somehow so the freeze could be guaranteed, and optionally play the GIF on mouse over or tap (perhaps even avoiding the lightbox). Do you agree?

Actually resizing or modifying the GIF while retaining all the frames is akin to video transcoding.

I would imaging since “Photon” is creating and delivering thumbs to the browser it’s “bypassing” JIG’s animation break. It’s being sent to the CDN as “broken” but still sending the entire GIF so what comes back is the unbroken GIF. Does that sound plausible?

As a still photographer for many many years the days of large print jobs are less and less, it’s all about online. So, GIFs have gone from kittens playing to an actual valuable media form. I don’t have many GIFs on my site yet so haven’t seen an issue, but, selecting the first frame as the thumb would probably leave some people a little flustered. Agan, for kittens it’s OK but showing a product is different.

If it’s possible, the way youtube does it would be great, might even be a little easier with GIFs. Open any GIF in Photoshop and you can see all the frames, and, GIFs are usually pretty short so pulling 2 frames a second from a long 5 second GIF would only be 10 frames and give a good selection to choose from as the thumbnail. Also, probably don’t need to add the “upload thumb” feature since the extraction process would yield frames from start to finish. OR, .... keep it as is but allow a thumb version to be uploaded using a naming convention similar to retina images: logo.png = logo@2x.png | silly-kittens.gif = silly-kittens@gif_thumb.gif

GIFs are actually kinda large compared to an image, maybe lazy loading full GIFs after the thumbs load so hover or tap is “instant.” Anyway, something to think about like you don’t have enough. Been using and loving the plugin for years!!! I think I even did a testimonial for you way back then.

Yup! https://justifiedgrid.com/reviews/firsh-you-are-the-man/

Well that goes a bit beyond what a gallery display should do at a first glance, but perhaps as a module/plugin for enhanced GIF galleries I could implement something like that. The images should and can be processed upon upload to take only a few frames, but what if a customer already has them uploaded and then install the plugin later? That brings up more questions WP supports setting a featured image for content that normaly doesn’t have, like PDFs or videos, but GIFs are treated as just images. So I presume the GIF excerpt creation should be just an automatic process by a subfeature of JIG. Good talk.

Update: something else buggy that I forgot about, because it’s the backend, but maybe same issue. When I open a grid and click to Edit Gallery almost always some of the images don’t load, random white boxes. I had the network tab open, Chrome inspector, and watched all the error 500s show up.

Damn, so close to launching! Thanks!

500 is an internal server error, about which not much information is available just by looking at the site. Try disabling timthumb and choosing a WordPress-generated image size in its place.

I think it has to do with concurrent connections, this page might load more images than usual. Browser refresh with enabled cache can fix it as your browser will not request already-encountered images again on subsequent page loads.

Hi, the video only plays when you click/tap the thumbnail (and it goes into the lightbox). The thumbnail is just an image which does not move or become a video by scrolling. Thanks for the suggestion, I’ll consider it when building better video gallery support!

Yes all of that.

1 Yes it’s the same look.

Note, for #2, it’ll take up as much space as anything else can. Drop long text in the space that you will place it in to see. So it will not go above boundaries set by CSS.

Points 3, 4, 5, 6 of course.

Thank you. Client asked me to double check the following before we buy it: “Lets say we have 100 images in the gallery, but only 20 are displayed on the page due to infinite scrolling settings. Client clicks on the first image and the lightbox is opened – will he be able to browse all 100 images in the lightbox, or only 20 ones that are currently displayed on the page? “

Yes they can browse all 100 through the lightbox even if they did not scroll down one bit. The list of all images is prepared, and only the image loading is delayed by the lazy loading. There is no further list of images to fetch on scroll that would prevent someone from seeing all of them in the lightbox. So you are all good.

Currently not, but thanks for the idea I’ll check it out. I’m only familiar with AWS, and there is a workflow that syncs or offloads wp media library content to S3, then you put CloudFront in front of it. Do you imagine the azure workflow as images still managed in the wp media library but hosted on azure, or using it as a remote source as if it were some kind of FTP folder?

Their plan is to use it as remote source.

Hi, do you mean something like this? https://justifiedgrid.com/sources/flickr/collections-multi-level/