Lightbox rel attribute?

[demonboy]

Hi,

I appreciate you don’t support plugins but I’m using a plugin that should make my bbpress thumbnail attachments into clickable lightbox images IF I add in the correct CSS and REL lightbox attribute. I’m assuming X theme has Lightbox already active, so I just need to fill in the gaps.

Is the REL attribute just ‘lightbox’?

Do I need to add in any JS to make this work? The plugin allows me to add a css class. I found this JS which I tried adding:

$(document).ready(function() {

    // Scan the webpage for all class names of 'bbthumb' that is seen.
    $('.bbthumb').each(function(){

        // For each class name of 'bbthumb' found, go to the parent item of that thumb and apply the rel attribute.    
        $(this).parent().attr('rel','lightbox');

    });

});

Is this JS code needed to make lightbox work on these thumbnails which are given the CSS class ‘bbthumb’?

Thanks in advance.

[christian]

Hey @demonboy,

That could probably work. But, what we need to know here is if the part that you’re trying to add a class is a template that our theme overrides because if not, you need to contact bbPress support to learn how to customize their plugin.

Please give us the URL of the bbPress page and tell us or give us a screenshot of the element that you’d like to add a class and rel attributes and we’ll see if our theme overrides the template.

Thanks.

[demonboy]

Hi @christian_y,

Thanks for getting back to me. Here’s the input fields for the plugin:

And this is Inspector, highlighting the clickable thumbnail:

LMK if there is anything else…

[demonboy]

Sorry, that last one didn’t come out so well.

[rad]

Hi @demonboy,

Based on the code from your screenshot (thumbnails), it doesn’t seem to be connected to our theme since the classes aren’t from us. And your javascript code from your first post may not work due to script priority loading. Rel should be added directly to the HTML code and not by javascript.

And I’m also confused about the first screenshot too, is that from the lightbox plugin? Because that one is what you need and doesn’t really need a javascript code like from above, that’s because you can already add the REL value and CSS Class on those settings. Perhaps you can provide a URL of the lightbox plugin of what you’re using? I can’t promise any solution, but what you need to do are already there. Perhaps you should contact the author of the lightbox plugin as well.

Thanks!

[demonboy]

No, there is no lightbox plugin, @Rad. The first screenshot is from the plugin that manages attachments to bbpress. It’s in that that I add the class and REL. I am assuming that lightbox is already running in X, or do I have that wrong? Should I be using a lightbox plugin as well?

[rad]

Hi @demonboy,

Ah, I see. Thanks for the clarification. In that case, you don’t need any javascript of REL changes. What you need is just add this code to child theme’s functions.php

add_action('wp_footer', 'x_bb_global_lightbox', 9999999);
function x_bb_global_lightbox () {
echo do_shortcode('[lightbox selector="a.bbthumb"]');
}

Thanks!

[demonboy]

Hmmm, that doesn’t seem to work. I’ve ftp’d the functions file, included the class ‘bbthumb’ and the REL in the plugin. Both are being reflected according to inspector:

[rad]

Hi @demonboy,

It could be due to filter priority, could you try a negative values? Like from this

add_action('wp_footer', 'x_bb_global_lightbox', 9999999);

to this

add_action('wp_footer', 'x_bb_global_lightbox', -9999999);

I see the code works, it’s just the lightbox library is not enqueued.

Thanks!

[demonboy]

Yes! That’s the ticket. Thanks, @Rad, it worked.

[ruenel]

You’re welcome!
We’re glad @Rad’s solution works out for you.

[demonboy]

He’s been knocking these solutions out the park lately, @RueNel. You all have. I’m really grateful of your support. I’m close to launching my community and as a one-man band it’s been getting quite intense with many varied issues to iron out. You guys have been most excellent in your assistance, patient and thorough, despite the odd tantrum from my end. When it launches I’m hoping you won’t hear from me for a while

Best support team I’ve come across. Thank you.

[ruenel]

Yes, we are always try to serve better everyday.
We really appreciate for the kind words @demonboy!