[Resolved] Lightweight Lightbox

[SLIM]

This is a follow-up of this topic:
https://generatepress.com/forums/topic/lightweight-modal-lightbox/

I’m interested in enabling lightbox NATIVELY in the gutenberg image / gallery blocks. I found a plugin SimPLY gallery – but this plugin seems to add and come with a fair bit of bloat.

Do you guys currently have any plugins that would enable lightbox natively within the gutenberg blocks? If not – could i request this feature to be added to the GenerateBlocks plugin at least 🙂

According to this page:
https://wordpress.com/support/wordpress-editor/blocks/image-block/

It should have it in there? ^^^ ( CTRL+F = “lightbox” ) and you’ll see what i mean
Cheers

[David]

Hi there,

its not something we have in our offering yet.
We may consider it in a future release of GenerateBlocks as GB 1.5 will have an Image Block 🙂

What you see there is from wp . com who has a slight variant on several of the core blocks including features that don’t ( currently ) exist in .org

Some suggestions made here for plugins:

https://generatepress.com/forums/topic/lightweight-modal-lightbox/#post-1020584

Scroll down for a user suggestion too.

[SLIM]

Ahh I see, yes the dotcom was like rented wordpress 🙂 i remember now.
Thank you David.

[David]

You’re welcome

[Josue]

Hi David,

The only plugin recommended in this topic: https://generatepress.com/forums/topic/lightweight-modal-lightbox/#post-1020584 – which doens’t use JQuery hasn’t been updated for over a year, hasn’t been tasted with the latest version of WP, and it has only like 10 active users. So, I’m wondering now that Generateblocks has an image block if you guys have a recommendation for a lightbox lightweight plugin/solution without JQuery?

Thank you in advance,

[David]

Hi there,

most lightbox plugins rely on jQuery.
There is the fslightbox.js script that does it without jQuery. And looks like someone made that into a plugin

https://wordpress.org/plugins/simple-lightbox-fslight/

Its over Wp 5.9 and has at least been updated in the last 3 months

[Josue]

Hi David,
Thank you for your answer. That plugin may be the best option available without jQuery. I’ve searched a lot for one, so I will try this one out.
Best,

[Josue]

Just so you guys know, I’ve tried that plugin on a staging website and couldn’t make it work. Perhaps anyone else has better luck…

[David]

Might be worth asking in our Facebook group – to see what others are using.

[Josue]

Good idea David, I’ll do it.

[Josue]

David someone suggested in your Facebook page one that looks like a good option. Vanilla JS: https://wordpress.org/plugins/gallery-block-lightbox/#utm_medium=referral&utm_source=facebook.com&utm_content=social – I haven’t been able to make it work with the image block of Generateblocks.

I’ve managed to make it work with the image block of Gutenberg though, but I’m only using Generateblocks, to avoid the 86 KB of Gutenberg.

I guess there must be something that I am missing…

[David]

If you select your GB Image Block, and go to its Dynamic Data, and enable Dynamic Data and just set the: Link source: Single Image

[Josue]

Yes, I did that, but doesn’t work. I realized that it works with certain blocks only like you can see here: https://wordpress.org/plugins/gallery-block-lightbox/ and GB block image is not listed there.

However they said in the Facbook group that we can make that plugin work with GB block too, its just that we have to enqueue the js ourselfs for GB image blocks. We would do that with has_block condition. How can we do that?

[David]

They would need to provide the function for enqueueing their scripts.
If the could do that, then we could tweak it for GB image block.

[Josue]

They already give this information in their FAQ’s:

FAQ –> How to enqueue the necessary assets (script & style) for blocks outside of posts or for block types that are not supported by default?

If you want to use the Gallery & Image Block Lightbox plugin with a block type that is not supported by default, you can make use of the has_block() function. For instance, in the case of the Kadence Blocks Advanced Gallery, use:
add_filter( ‘baguettebox_enqueue_assets’, function ( $enqueue_assets ) {
return $enqueue_assets || has_block( ‘kadence/advancedgallery’ );
} );
Of course, in the previous example you also have to add the appropriate baguettebox selector, i.e.
add_filter( ‘baguettebox_selector’, function( $selector ) {
return $selector . ‘,.wp-block-kadence-advancedgallery’;
} );

[Author]

Posts