Posted by & filed under article.

During an implementation of vSlider for my wordpress, I discovered later on that it disables the insert new media button when trying to insert a image into a blog post. While it works perfectly to open the add media and upload and browse images, it is not possible to insert the selected image  into the article.

During debugging of the vSlider plugin I discovered where things went wrong. In the file custome.js located in includes/js/custom.js

On the proximate line 210, there is a function assignment to window.send_to_editor that assigns a new callback function. Now this overrides the send_to_editor function that is already assigned when the vSlider plugin is loaded.

window.send_to_editor = function(html) {
  imgurl = jQuery('img',html).attr('src');
  jQuery('#image_path'+id).val(imgurl); /*assign the value to the input*/

Since this JavaScript is loaded for all the admin-pages, the quick solution would be to restrict the JavaScript to only be loaded when required.

The solution to this, is to locate the register.php in plugins/vslider/includes/. Edit register.php and look for the original line

add_action( ‘admin_footer’, ‘enqueue_vslider_admin_scripts’ );

This function adds all JavaScript functions that vSlider requires on every admin page. Now as mentioned, these files are added to the admin_footer, which is located on every admin page. So when the script custome.js is loaded, it will not work as it is overwritten.

By changing the add_action( ‘admin_footer’, ‘enqueue_vslider_admin_scripts’ ); to add_action( ‘admin_enqueue_scripts’, ‘enqueue_vslider_admin_scripts‘ ); and adding a if statement in top of the function, checking for the plugin page to be vSlider (see code below) we can tell WordPress to only load the vSlider files, when actually needed in WordPress.

function enqueue_vslider_admin_scripts($hook) {
    if( 'toplevel_page_vslider' != $hook )
	wp_enqueue_script( 'prettyPhoto-js', VSLIDER_URL.'/includes/js/jquery.prettyPhoto.js', array('jquery'));
	wp_enqueue_script( 'flexslider', VSLIDER_URL.'/js/jquery.flexslider-min.js', array('jquery'));
	global $vslider_script;
	echo '<script type="text/javascript">'.$vslider_script.'</script>';
	wp_enqueue_script( 'ajax-script', VSLIDER_URL.'/includes/js/custom.js', array('jquery'));
add_action( 'admin_enqueue_scripts', 'enqueue_vslider_admin_scripts' );

Hope they make an update for this soon, as vSlider is a great plugin for WordPress.

Leave a Reply

  • (will not be published)