Hello,
Populate “Custom JS code” parameter on “ARI Fancy Lightbox -> Settings -> Advanced” page with the following code:
setTimeout(function() {
$(‘.tiled-gallery__item>img’).each(function() {
var $img = $(this), $parent = $img.parent();
$parent.attr(‘data-src’, $img.attr(‘data-url’));
$parent.attr(‘data-caption’, $img.attr(‘data-image-title’));
$parent.attr(‘data-fancybox’, ‘gallery’);
});
$(‘.tiled-gallery__item’).fancybox();
$(‘.tiled-gallery__item’).click(function() {
return false;
});
}, 10);
Thank you, I have added the custom JS code but it seems like Jetpack carroussel still opens the default lightbox.
Should it work right away with default settings of is there a setting to override the default lightbox I’ve missed?
Sorry, the code in our previous post was corrupted (‘ was replaced with ‘). Replace the symbol in the code please or you can contact use by email and we will send correct code.
-
This reply was modified 3 years ago by
arisoft.
-
This reply was modified 3 years ago by arisoft.
I’ve adjusted the code and it seems to work now. Must have been tricky to spot that issue, thank you so much for your time and support.
The only issue remaining is that it seems to load a downscaled version instead of the fullsize image. I understand this is default jetpack carousel behavior as the regular jetpack lightbox provides an option to load the “full size image” in a new window so I suppose Ari Fancy Lightbox can only load the initial downscaled version. I specifically use your plugin because I love the zooming behavior so much so I suppose I will have to use a gallery plugin which loads the fullsize images. I’ve used NGG on my personal website so I’ll go back to that or I might give FooGallery a swing.
Try to replace the following code:
$parent.attr(‘data-src’, $img.attr(‘data-url’));
with the following one (don’t forget to replace with ’ with correct symbol):
$parent.attr(‘data-src’, $img.attr(‘data-orig-file’));
That works perfectly, amazing! Thank you so much. You provide the best support!
Quick last question, will these compatibility fixes make it into future updates or will I have to keep this code in the custom JS box indefinately?
I wouldn’t mind either way, just curious. 🙂
