How to add lightbox to WordPress default gallery

Hi guys,

I am new to Beans but loving all the features now. Thanks to all of you community.

I found the Wordpress has the default gallery feature but need to refine it a bit. The gallery image links to a page by default, I'd like to add the lightbox from the UIkit. All I need to do is add the data-uk-lightbox="{group:'my-group'}" into the image link. I found all the gallery image codes are wrapped in the beans_post_gallery_icon in the post.php. However, I am not good at php and don't know how to add the lightbox snippet inside this section.

Hopefully you guys here can help and thanks in advance.

Jerry

Hello @nlife7,

Have you read this thread. ? Maybe it could help.

Mathieu

Hi Mathieu,

Thanks for your reply. I had read the thread but couldn't get it to work as the snippet is for featured post images not gallery images. As I am lack of php knowledge, I don't know what codes to add in the post.php. If the defalut php code in post.php can be rendered into HTML from

<div class="gallery-icon landscape" data-markup-id="beans_post_gallery_icon[_122]">
    <!-- open output: beans_post_gallery_icon[_122] -->
    <a href="my-image.jpg"><img src="my-image.jpg"></a>
    <!-- close output: beans_post_gallery_icon[_122] -->
    </div>

to

<div class="gallery-icon landscape" data-markup-id="beans_post_gallery_icon[_122]">
    <!-- open output: beans_post_gallery_icon[_122] -->
    <a href="my-image.jpg" data-uk-lightbox="{group:'my-group'}"><img src="my-image.jpg"></a>
    <!-- close output: beans_post_gallery_icon[_122] -->
    </div>

The problem will be solved.