Adding Featured Image to Gallery

Any help with this would be much appreciated! I know it must be simple to have the gallery be called if theres images in the post or not.

Thanks so much.

Hi Tbranson,

Currently the lightbox will only load if there are images in the gallery. This is so your website doesn’t load unnecessary scripts and CSS when your post does not have any images in the gallery.

If you’d like the lightbox to open when you click your featured image you’ll need some custom development which is outside the scope of support I can provide.

Here’s some pointers though:

1. Write a PHP function that loads the required JS call on your page, see easy_image_gallery_js()

2. Enqueue the required CSS for the light box you are using, see easy_image_gallery_scripts()

3. Enqueue the required JS script for the lightbox you are using, see the same function, easy_image_gallery_scripts()

Okay –

Thanks for getting me started.

I successfully Enqueued the CSS and the JS for prettyPhoto in my Theme Functions file.

function prettyphoto_scripts() {
			wp_enqueue_script( 'my-js', 'https://lincolnbeacon.com/wp-content/plugins/easy-image-gallery/includes/lib/prettyphoto/jquery.prettyPhoto.js', false, 0.1 );
			wp_enqueue_script( 'my-css', 'https://lincolnbeacon.com/wp-content/plugins/easy-image-gallery/includes/lib/prettyphoto/prettyPhoto.css', false, 0.1 );
		}

		add_action( 'wp_enqueue_scripts', 'prettyphoto_scripts' );

However, I can’t seem to get the JS to call properly on the page…. When I try to call the function easy_image_gallery_js() I receive an error “Uncaught ReferenceError: easy_image_gallery_js is not defined” and I’m stuck because not sure the proper way to define it?

Most likely not calling it properly (new to PHP) but I’ve tried:

echo '<script type="text/javascript">'
   , 'easy_image_gallery_js();'
   , '</script>'
;

and I’ve tried Ajax:

function ajaxCall(){
$.ajax({
    type: "GET",
    url: "https://lincolnbeacon.com/wp-content/plugins/easy-image-gallery/includes/scripts.php"
   });
};

Your help is much appreciated. Please any more support would be so great. What am I doing wrong?

Is there no way to easily remove the bit of code in the plug-in that tells it to only load the JS and CSS when there is gallery images?

Thanks again.

Easy Image Gallery was not intended to do what you are wanting so there isn’t a way to remove the conditional check without modifying core plugin files.

All you need to do is output the Javascript required to load PrettyPhoto on your featured image, see the JS inside easy_image_gallery_js(). Eg:


<script>
jQuery(document).ready(function() {
jQuery("a[rel^='prettyPhoto']").prettyPhoto({
social_tools : false,
show_title : false
});
});
</script>


See also the documentation for PrettyPhoto which explains how to do this as well:
https://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/documentation

That got me on the right track. Thanks so much for helping out.

Your plug-in does great. Thanks again. All the best. –

Glad that helped!