It’s been talked many times that WordPress outputs some really bad code for the built-in gallery function.
This is the core code responsible for the gallery output (in /wp-includes/media.php):
function gallery_shortcode($attr) {
global $post;
static $instance = 0;
$instance++;
// Allow plugins/themes to override the default gallery template.
$output = apply_filters('post_gallery', '', $attr);
if ( $output != '' )
return $output;
// 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'] );
}
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];
}
} 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}";
$gallery_style = $gallery_div = '';
if ( apply_filters( 'use_default_gallery_style', true ) )
$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>
<!-- see gallery_shortcode() in wp-includes/media.php -->";
$size_class = sanitize_html_class( $size );
$gallery_div = "<div id='$selector' class='gallery galleryid-{$id} gallery-columns-{$columns} gallery-size-{$size_class}'>";
$output = apply_filters( 'gallery_style', $gallery_style . "ntt" . $gallery_div );
$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='wp-caption-text 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;
}
What I would like to fix?
[1] The above code outputs css style directly into the post. I want to stop that, as I can easily add the same css code in my style.css stylesheet.
[2] I want to disable the code from outputting captions of images below their thumbnails. I want the captions to be shown only on the attachment pages, and not in the post.
[3] The aforementioned code adds two <br style="clear: both;"> elements after the gallery code. I would also like to disable that, since I can use “margin” in the css code for that.
I would like to accomplish the above “THREE” things using some PHP code in the functions.php file, as editing the core files is not recommended.
Hope someone can be of some help. (I don’t know how to code, so, please be as much clear as possible.) Thanks!
RELEVANT: Source file to look at is /wp-includes/media.php (here’s the trunk version — look for gallery_shortcode function).
Like it was mentioned before removing the shortcode and re-adding it is not the compatible with other plugins modifying galleries so instead you use the
post_galleryfilter hook and the same code from thegallery_shortcodefunction but with your own modification for example, I’ve commented out the parts you don’t want:See badlearner‘s edit below
You can remove the default shortcode and create your own. Like so (in your functions.php):
The easiest way to alter the shortcode is to copy paste it in your functions.php and change the function to name to something like
my_own_gallaryand begin editing.EDIT
As goldenapples in the comments pointed out:
There is a filter for the gallery shortcode, so no need to remove the shortcode first.
example you can use in your functions.php (output is as default gallery shortcode, so you can alter it).
Explanation:
In the shortcode defined by WordPress you will see:
This means that if an filter is applied and returns something, that will be used (returned), otherwise the function continues (default shortcode).
To add a filter you use the add_filter function. The first argument is the tag of the filter (in this case ‘post_gallery’), the second the function to add (the function that will return your custom gallery output).
So this will output “test” for the shortcode [gallery]:
In my example below edit you will see the add_filter to create the default shortcode with your own editable code. You can edit this, or start from the ground up as you please.
(EDIT by Otto: The above has now been fixed by Otto. @RobVermeer was missing the first parameter to the filter and didn’t do the add_filter correctly. The post_gallery filter is the correct way to do this. Removing the shortcode and re-adding it (as tried by badlearner below) is not advisable since it’s incompatible with other plugins modifying galleries as well.)
Added / Edited by badlearner:
The filter method of modifying the gallery code (in /wp-includes/media.php) using functions.php, as provided by @RobVermeer doesn’t seem to be working properly (see this answer’s comments).
But @RobVermeer’s first answer (i.e., prior to first edit), which unregisters the gallery shortcode and registers a new gallery shortcode, worked. And here’s the code, and Please feel free to edit or add an answer if there’s a better way.
The following is the code that needs to be added in your theme’s functions.php file:
well its still there in the new version of wordpress as of 3.8
heres the fix i made to remove that used the same code above but added a couple of lines
add_filter( 'use_default_gallery_style', '__return_false' );