Change Wordpress default gallery output

Yes, indeed. Quite a while ago I've found this code and have been using it ever since. It's great to customize WP's default gallery to whatever you want.

There's a filter to post_gallery which you can use to customize all default WP galleries. Here's a sample of the code I use adapted to the template you provided. I've cleared it up as much as possible.

The first part of the function is pretty much gallery attachments handling, so you'll probably just want to change the latter half, the one that determines the output of your gallery template (follow the comments):

add_filter('post_gallery', 'my_post_gallery', 10, 2);function my_post_gallery($output, $attr) {    global $post;    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,        'itemtag' => 'dl',        'icontag' => 'dt',        'captiontag' => 'dd',        'columns' => 3,        'size' => 'thumbnail',        'include' => '',        'exclude' => ''    ), $attr));    $id = intval($id);    if ('RAND' == $order) $orderby = 'none';    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];        }    }    if (empty($attachments)) return '';    // Here's your actual output, you may customize it to your need    $output = "<div class=\"slideshow-wrapper\">\n";    $output .= "<div class=\"preloader\"></div>\n";    $output .= "<ul data-orbit>\n";    // Now you loop through each attachment    foreach ($attachments as $id => $attachment) {        // Fetch the thumbnail (or full image, it's up to you)//      $img = wp_get_attachment_image_src($id, 'medium');//      $img = wp_get_attachment_image_src($id, 'my-custom-image-size');        $img = wp_get_attachment_image_src($id, 'full');        $output .= "<li>\n";        $output .= "<img src=\"{$img[0]}\" width=\"{$img[1]}\" height=\"{$img[2]}\" alt=\"\" />\n";        $output .= "</li>\n";    }    $output .= "</ul>\n";    $output .= "</div>\n";    return $output;}

Just paste it to your functions.php file and modify to adapt it to your need. I'm pretty sure it'll work for you as it have worked for me :)

Super answer Mathielo.

However, I needed the option of including a caption, so I've modified your code to use the wp_prepare_attachment_for_js() function as that seems to provide the necessary data.

add_filter('post_gallery', 'my_post_gallery', 10, 2);function my_post_gallery($output, $attr) {global $post;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,    'itemtag' => 'dl',    'icontag' => 'dt',    'captiontag' => 'dd',    'columns' => 3,    'size' => 'thumbnail',    'include' => '',    'exclude' => ''), $attr));$id = intval($id);if ('RAND' == $order) $orderby = 'none';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];    }}if (empty($attachments)) return '';// Here's your actual output, you may customize it to your need$output = "<div class=\"slideshow-wrapper\">\n";$output .= "<div class=\"preloader\"></div>\n";$output .= "<ul data-orbit>\n";// Now you loop through each attachmentforeach ($attachments as $id => $attachment) {    // Fetch all data related to attachment     $img = wp_prepare_attachment_for_js($id);    // If you want a different size change 'large' to eg. 'medium'    $url = $img['sizes']['large']['url'];    $height = $img['sizes']['large']['height'];    $width = $img['sizes']['large']['width'];    $alt = $img['alt'];    // Store the caption    $caption = $img['caption'];    $output .= "<li>\n";    $output .= "<img src=\"{$url}\" width=\"{$width}\" height=\"{$height}\" alt=\"{$alt}\" />\n";    // Output the caption if it exists    if ($caption) {         $output .= "<div class=\"orbit-caption\">{$caption}</div>\n";    }    $output .= "</li>\n";}$output .= "</ul>\n";$output .= "</div>\n";return $output;}

I know the original question has been answered but I just wanted to share what I've done with the filter snippet in case it helps anyone else. I've enabled Miro Mannino's 'Justified Gallery' jquery plugin http://miromannino.com/projects/justified-gallery/ to work with Wordpress galleries in Wordpress 3.9 ... Here's the code with the changes I made to get it to work... (img size light thumb is my custom thumbnail to preserve image dimensions but keep page load times down.)

// Custom Galleryadd_filter( 'post_gallery', 'my_post_gallery', 10, 2 );function my_post_gallery( $output, $attr) {global $post, $wp_locale;static $instance = 0;$instance++;// We're trusting author input, so let's at least make sure it looks like a valid orderby statementif ( 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,    'itemtag'    => 'dl',    'icontag'    => 'dt',    'captiontag' => 'dd',    'columns'    => 3,    'size'       => 'light-thumb',    'include'    => '',    'exclude'    => ''), $attr));$id = intval($id);if ( 'RAND' == $order )    $orderby = 'none';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 '';if ( is_feed() ) {    $output = "\n";    foreach ( $attachments as $att_id => $attachment )        $output .= wp_get_attachment_link($att_id, $size, true) . "\n";    return $output;}$itemtag = tag_escape($itemtag);$captiontag = tag_escape($captiontag);$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: 0px;            text-align: center;            width: {$itemwidth}%;           }        #{$selector} img {            border: 0;        }        #{$selector} .gallery-caption {            margin-left: 0;        }    </style>    <!-- see gallery_shortcode() in wp-includes/media.php -->    <div id='$selector' class='gallery galleryid-{$id}'>");    $output = "<div id=\"mygallery\">\n";$i = 0;foreach ( $attachments as $id => $attachment ) {    $link = isset($attr['link']) && 'file' == $attr['link'] ? wp_get_attachment_link($id, $size, false, false) : wp_get_attachment_link($id, $size, true, false);    $output .= "<{$itemtag} class='gallery-item'>";    $output .= "        <{$icontag} class='gallery-icon'>            $link        </{$icontag}>";    if ( $captiontag && trim($attachment->post_excerpt) ) {        $output .= "            <{$captiontag} class='gallery-caption'>            " . wptexturize($attachment->post_excerpt) . "            </{$captiontag}>";    }    $output .= "</{$itemtag}>";    if ( $columns > 0 && ++$i % $columns == 0 )        $output .= '<br style="clear: both" />';}$output .= "    <br style='clear: both;' />    </div>\n";return $output;}

It works a treat. Thanks for sharing the filter - it was just what I was looking for.