I’m afraid there’s no plugin, but using jQuery GalleryView is not that hard actually.
Download
Download jQuery GalleryView and put the css and js folders inside a new folder galleryview in your theme’s folder.
Setting Up the List
jQuery GalleryView needs an unordered list so we have to alter the gallery output:
add_filter( 'post_gallery', 'my_post_gallery', 10, 2 );
function my_post_gallery($output, $attr) {
global $post, $wp_locale;
static $instance = 0;
$instance++;
if ( isset( $attr['orderby'] ) ) {
$attr['orderby'] = sanitize_sql_orderby( $attr['orderby'] );
if ( !$attr['orderby'] )
unset( $attr['orderby'] );
}
extract(shortcode_atts(array(
'order' => 'ASC',
'orderby' => 'menu_order ID',
'id' => $post->ID,
'columns' => 3,
'size' => 'thumbnail',
'include' => '',
'exclude' => '',
'ids' => '' // WP gallery shortcode uses ids="1,2,3"
), $attr));
$id = intval($id);
if ( 'RAND' == $order )
$orderby = 'none';
if ( empty($include) )
$include = $ids;
if ( !empty($include) ) {
$include = preg_replace( '/[^0-9,]+/', '', $include );
$_attachments = get_posts( array('include' => $include, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $order, 'orderby' => $orderby) );
$attachments = array();
foreach ( $_attachments as $key => $val ) {
$attachments[$val->ID] = $_attachments[$key];
}
} elseif ( !empty($exclude) ) {
$exclude = preg_replace( '/[^0-9,]+/', '', $exclude );
$attachments = get_children( array('post_parent' => $id, 'exclude' => $exclude, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $order, 'orderby' => $orderby) );
} else {
$attachments = get_children( array('post_parent' => $id, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $order, 'orderby' => $orderby) );
}
if ( empty($attachments) )
return '';
$columns = intval($columns);
$itemwidth = $columns > 0 ? floor(100/$columns) : 100;
$float = is_rtl() ? 'right' : 'left';
$selector = "gallery-{$instance}";
$output = apply_filters('gallery_style', "
<style type="text/css">
#{$selector} {
margin: auto;
}
#{$selector} .gallery-item {
float: {$float};
margin-top: 10px;
text-align: center;
width: {$itemwidth}%; }
#{$selector} img {
border: 2px solid #cfcfcf;
}
#{$selector} .gallery-caption {
margin-left: 0;
}
</style>
<ul id='$selector' class="gallery galleryid-{$id}">");
$i = 0;
foreach ( $attachments as $id => $attachment ) {
$image = wp_get_attachment_image($id);
$output .= "<li class="gallery-item">";
$output .= $image;
$output .= "</li>";
if ( $columns > 0 && ++$i % $columns == 0 )
$output .= '<br style="clear: both" />';
}
$output .= "
<br style="clear: both;" />
</ul>\n";
return $output;
}
Note: Of course, you can/have to customize this to your liking.
Enqueue the Scripts and Stylesheets
Let WordPress know what JS and CSS files we need and where they can be found:
add_action('wp_enqueue_scripts', 'enqueue_galleryview_stuff');
function enqueue_galleryview_stuff() {
wp_enqueue_script(
'jquery-ui-min',
'https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js',
array('jquery')
);
wp_enqueue_script(
'jquery-timers',
get_template_directory_uri().'/galleryview/js/jquery.timers-1.2.js',
array('jquery-ui-min')
);
wp_enqueue_script(
'jquery-easing',
get_template_directory_uri().'/galleryview/js/jquery.easing.1.3.js',
array('jquery-timers')
);
wp_enqueue_script(
'jquery-galleryview',
get_template_directory_uri().'/galleryview/js/jquery.galleryview-3.0-dev.js',
array('jquery-timers', 'jquery-easing')
);
wp_enqueue_style(
'jquery-galleryview',
get_template_directory_uri().'/galleryview/css/jquery.galleryview-3.0-dev.css'
);
}
Print the jQuery Code
In order for GalleryView to work, we have to bind the function to the desired galleries:
add_action('wp_footer', 'print_galleryview_jquery');
function print_galleryview_jquery() {
echo <<<JQUERY
<script type="text/javascript">
jQuery(document).ready(function($) {
$('ul[class^="galleryid-"],ul[class*="galleryid-"]').galleryView();
});
</script>
JQUERY;
}
Note: I’m using the wp_footer hook here.
Customization
So far, you should have the basic functionality of GalleryView attached to your WordPress galleries. Now it’s time to adjust the styling and the like, I guess…