add_filter and changing output captions of image gallery

I’d like to change only one output of native WP Gallery (in media.php)

On Smashing Magazine (link) author advises to change whole gallery_shortcode function.
But I wondered if is possible to change only specific output ($captiontag)

Read More

I wrote:

add_filter( 'captiontag', 'my_captiontag' );

function my_captiontag( $captiontag ) {
 $output .= "
  <{$captiontag} class='wp-caption-text gallery-caption'><p>
  " . wptexturize($attachment->post_excerpt) . "
  </p></{$captiontag}>";
}

but it doesn’t work 🙁

Related posts

Leave a Reply

2 comments

  1. There are no filter hook called captiontag. You can change the value of the caption html tag by specifying the captiontag option when inserting the [gallery] shortcode.

    From the gallery shortcode codex page:

    captiontag

    the name of the XHTML tag used to enclose each caption. The default is
    “dd”. For example, to change the gallery markup to use div, span and p
    tags:

    [gallery itemtag="div" icontag="span" captiontag="p"]
    

    Update:

    The following code will overwrite the default [gallery] output. It is basically a copy of the gallery_shotcode() function with one modification to display the image title wrapped in <h3> tag before the image:

    add_filter('post_gallery', 'my_gallery_shortcode', 10, 2);
    
    function my_gallery_shortcode($output, $attr) {
        global $post;
    
        static $instance = 0;
        $instance++;
    
        // 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'>";
            // Here we add the image title
            $output .= "
                <{$icontag} class='gallery-icon'>
                    <h3>$attachment->post_title</h3>
                    $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;
    }
    
  2. There is no need to copy the gallery shortcode. Just set your filter function between the native handler’s output and the final output.

    To do that, hijack the shortcode handler, then run a preg_replace_callback() over the output.

    add_action( 'after_setup_theme', 'wpse_74515_replace_gallery_shortcode' );
    
    /**
     * Replace the default shortcode handlers.
     *
     * @wp-hook after_setup_theme
     * @return  void
     */
    function wpse_74515_replace_gallery_shortcode()
    {
        // overwrite the native shortcode handler
        add_shortcode( 'gallery', 'wpse_74515_gallery_shortcode' );
    }
    /**
     * Create a filtered gallery output.
     *
     * @wp-hook gallery
     * @param   array $attr
     * @return  string
     */
    function wpse_74515_gallery_shortcode( $attr )
    {
        // Default value in WordPress.
        $captiontag = 'dd';
    
        // User value.
        isset ( $attr['captiontag'] ) && $captiontag = $attr['captiontag'];
    
        // Let WordPress create the regular gallery …
        $gallery = gallery_shortcode( $attr );
    
        // change the content of the caption
        $gallery = preg_replace_callback(
            '~(<' . $captiontag . '.*>)(.*)(</' . $captiontag . '>)~mUus',
            'wpse_74515_gallery_callback',
            $gallery
        );
    
        return $gallery;
    }
    /**
     * Change the result of the regex match from wpse_74515_gallery_shortcode.
     *
     * @param  array $m matches
     * @return string
     */
    function wpse_74515_gallery_callback( $m )
    {
        return $m[1] . wptexturize( $m[2] ) . $m[3];
    }
    

    Similar posts