Prevent a link from working if user is not logged in

Question

I have a Wordpress site which has a gallery on a page visible to all users.

The idea is that if a non-member clicks a gallery thumbnail, they get redirected to a signup page. If a user is logged in, the image displays in a lightbox as usual.

I'm playing with this jQuery code and can't get the preventDefault bit working - I think it's because it's inside a conditional.

$('.ngg-gallery-thumbnail a').on('click', function(event){

        if (!$('body').hasClass('logged-in')) {
            alert('Not logged in!');
            event.preventDefault();
        }
    });

Also I'm pretty sure there'll be a more secure way of doing this using PHP - if anyone can point me in the right direction I'd be most grateful!

Answer 1

Try like

$('.ngg-gallery-thumbnail a').on('click', function(event){
    event.preventDefault();
    if (!$('body').hasClass('logged-in')) {
        alert('Not logged in!');
        return false;
    }
    $(this).addClass('lightbox');
});

Dont give the lightbox class before,first check for the condition and then if it satisfies then add class for the lightbox