This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Automatically link to lightbox when linking to an enlarged images throughout site, Jump Start 2.0

  • Creator
    Topic
  • #20569
    Wendell Harness
    Participant

    Thanks Jason, I appreciate the feedback and taking a look!

    One more unrelated question: Is there a way to automate lightbox for any images throughout the site that link to themselves (without using a shortcode)? I’m thinking about purchasing FooBox, but wanted to check to see if that type of functionality is available with WPJS before pulling the trigger.

    Thanks again!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Author
    Replies
  • #20577
    Jason Bobich
    Keymaster

    You’d have to do it with javascript from your child theme. So, you’d enqueue a javascript file from your child theme.

    You could bind to all <a> tags, check if they link to a file with image extension and then bind magnific popup to it.

    jQuery(document).ready(function($){
    
    	// Bind to every <a> tag
    	$('a').each(function(){
    
    		// If already a lightbox image, move on
    		if ( $(this).hasClass('themeblvd-lightbox') ) {
    			return;
    		}
    
    		// Account for any parameters being added to
    		// URL, like with W3 Total Cache, for example.
    		var url = this.href.split('?');
    			url = url[0];
    
    		// Append lightbox to link, if it links to an image file extension
    		if ( url.match(/\.(jpe?g|png|bmp|gif|tiff?)$/i ) ) {
    		   	$(this).magnificPopup({type:'image'});
    		}
    
    	});
    
    	// ... your other jQuery stuff ...
    
    });
    #20605
    Wendell Harness
    Participant

    Beautiful, thank you.

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.