[Resolved] Lightweight Lightbox

[SLIM]

Is there an actual difference to the GenerateBlocks IMAGE block and the default one?

Great find on that plugin btw.
And WHAT FACEBOOK GROUP?

[David]

Try:

1. for loading the scripts if the GB image block is on the page:

add_filter( 'baguettebox_enqueue_assets', function ( $enqueue_assets ) {
    return $enqueue_assets || has_block( 'generateblocks/image' );
} );

2. The baguettebox_selector – this i am unsure of as it believe that is for handling a Gallery not a single image. So i think you can ignore that ? no ?

Or you can try targetting the figure wrapper on the GB image (?) ie.

add_filter( 'baguettebox_selector', function( $selector ) {
    return $selector . ',.gb-block-image';
} );

[David]

@slim_k – these are our Facebook groups:

https://www.facebook.com/groups/generatepress
https://www.facebook.com/groups/generateblocks

Difference between Core and GB Image Block.
They both use the core get attachment functions to display the image.
But GBs block has all the GB Styling controls. So you have far greater stying options in the editor with GB.
The Advanced > Additional CSS Class in GB Image puts the class on the <img> tag, which means adding custom classes for things such as lazyloading can be done more easily.
For in post images, i would generally use the core Image Block. The GB Image block really makes the most sense when you need to break from the theme styles of the core image.

[Josue]

Thanks David, where is the best place to add this filter?

[David]

This doc explains:

https://docs.generatepress.com/article/adding-php/

TLDR:
Are you using a Child Theme? IF yes, then it goes in the Child Theme > Functions.php
IF No, then you need the Code Snippets plugin to which you will add it in a New Snippet.

[Josue]

Hi David,

I use the Code Snippets plugin. I already tested it, and it only works with the second script:

add_filter( 'baguettebox_enqueue_assets', function ( $enqueue_assets ) {
    return $enqueue_assets || has_block( 'generateblocks/image' );
} );

So, after chating a lot with other users in the Facebook page, it seems that the best two solutions are:

1. The Vanilla JS plugin very lightweight: https://wordpress.org/plugins/gallery-block-lightbox/#utm_medium=referral&utm_source=facebook.com&utm_content=social – but we need to use the script above.

2. Another JS plugin also lightweight: https://wordpress.org/plugins/gallery-block-lightbox/#utm_medium=referral&utm_source=facebook.com&utm_content=social

The first one is more lightwegith, but the second one doesn’t need a script. Which one would you guys recommend? – Anyway, both of them work very well, I hope this helps other users who were also looking for one.

[Jesús]

You can use “Lightbox for Gallery & Image Block” and add “gallery” or “wp-block-image” class to the image parent container.

[Josue]

Hi Jesus,
What about the ones like me who only use the image block from Generateblocks? do you know by any chance what class we could add to the image parent container?

[Author]

Posts