Customizing gallery shortcode in 3.5

I’m trying to customize the gallery shortcode using the new gallery system in 3.5 and I’m having a bit of trouble and can’t figure out where I’m going wrong. This is what I’ve got at the moment (in functions.php):

include( 'lib/theme-setup.php' );
include( 'lib/load-scripts.php' );

add_filter( 'post_gallery', 'my_custom_gallery', 10, 2 );
function my_custom_gallery( $output, $attr) {
    global $post;

    // We're trusting author input, so let's at least make sure it looks like a valid orderby statement
    if ( isset( $attr['orderby'] ) ) :
        $attr['orderby'] = sanitize_sql_orderby( $attr['orderby'] );
        if ( !$attr['orderby'] )
            unset( $attr['orderby'] );
    endif;

    extract(shortcode_atts(array(
        'order'      => 'ASC',
        'orderby'    => 'menu_order ID',
        'id'         => $post->ID,
        'columns'    => 0,
        'size'       => 'medium',
        'include'    => ''
    ), $attr));

    $id = intval($id);

    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];
        }
    } 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 '';

    if ( is_feed() ) {
        $output = "n";
        foreach ( $attachments as $att_id => $attachment )
            $output .= wp_get_attachment_link($att_id, $size, true) . "n";
        return $output;
    }

    $output .= '<div id="gallery-scroller">';
    $i = 1;

    foreach ( $attachments as $id => $attachment ) :

        $attimg = wp_get_attachment_image( $id, $size );
        $atturl = wp_get_attachment_image_src( $id, $size );
        $output .= '<img src="'.$atturl[0].'" alt="Demo image" id="'.$i.'" />';
        $i++;

    endforeach;

    $output .= '</div>';

    return $output;
}

Then I just have a simple custom page template that displays the gallery referencing ‘the_content()’ within the loop to output the gallery shortcode:

Read More
if (have_posts()) : while (have_posts()) : the_post(); 
    the_content(); 
endwhile; endif;

The images show up, but for some reason the javascript functionality for the gallery does not work using it this way. The problem has to be with the shortcode because oddly enough, if I take out the loop in the custom page template and just add a function to retrieve the attachments of the page instead of using the shortcode, the javascript works and loads fine. The problem with this though, is that it pulls in all the images attached to that page, and I just want the ones that are in the gallery for that particular page which the gallery shortcode accomplishes. I really like the new gallery interface for 3.5 and would love to be able to implement this functionality for my galleries.

Any advice on what might be causing this?

Related posts

Leave a Reply

1 comment

  1. Make sure that the javascript loaded by your load-scripts.php is waiting for the document to finish loading before attaching all of the listeners.

    When you created a separate function the code ran only a tiny bit earlier, but it was probably early enough for the elements to finish loading and the listeners to properly attach.