WordPress.org

Ready to get started?Download WordPress

Forums

Help overriding gallery_shortcode default markup (3 posts)

  1. MeTaLoRgY
    Member
    Posted 5 years ago #

    By default, WordPress uses some very nasty code to output galleries using the gallery shortcode. This is managed from wp-includes/media.php, specifically by the next function:

    function gallery_shortcode($attr) {
    	global $post;
    
    	// 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',
    	), $attr));
    
    	$id = intval($id);
    	$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 $id => $attachment )
    			$output .= wp_get_attachment_link($id, $size, true) . "\n";
    		return $output;
    	}
    
    	$listtag = tag_escape($listtag);
    	$itemtag = tag_escape($itemtag);
    	$captiontag = tag_escape($captiontag);
    	$columns = intval($columns);
    	$itemwidth = $columns > 0 ? floor(100/$columns) : 100;
    
    	$output = apply_filters('gallery_style', "
    		<style type='text/css'>
    			.gallery {
    				margin: auto;
    			}
    			.gallery-item {
    				float: left;
    				margin-top: 10px;
    				text-align: center;
    				width: {$itemwidth}%;			}
    			.gallery img {
    				border: 2px solid #cfcfcf;
    			}
    			.gallery-caption {
    				margin-left: 0;
    			}
    		</style>
    		<!-- see gallery_shortcode() in wp-includes/media.php -->
    		<div class='gallery'>");
    
    	foreach ( $attachments as $id => $attachment ) {
    		$link = wp_get_attachment_link($id, $size, true);
    		$output .= "<{$itemtag} class='gallery-item'>";
    		$output .= "
    			<{$icontag} class='gallery-icon'>
    				$link
    			</{$icontag}>";
    		if ( $captiontag && trim($attachment->post_excerpt) ) {
    			$output .= "
    				<{$captiontag} class='gallery-caption'>
    				{$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 want to do is override this function and use an ul with no style tag in the middle of my body. Searching around, I found some useful pieces of code and managed to write this:

    function remove_gallery_css()
    {
    	return "<ul class=\"gallery\">";
    }
    add_filter('gallery_style', 'remove_gallery_css');
    
    function fix_gallery_output( $output )
    {
    	$output = preg_replace("%</div>%", "</ul>", $output);
    
    	return $output;
    }
    add_filter('the_content', 'fix_gallery_output',11, 1);

    The first functions removes the <style> tag and works like a charm. It also removes the <div class="gallery"> and replaces it with an ul. The problem comes with the second function. It basically removes any </div> from the_content and replaces it with an /ul
    . Works perfectly unless you have a </div> (div end tag) somewhere else in your posts/pages.

    Si the question is, how do I replace the gallery_shortcode output of </div> with an /ul without affecting anything else? Of course, I could hack media.php, but I'd like to distribute this as a plugin so people won't have to hack media.php

  2. Bad Feather
    Member
    Posted 5 years ago #

    Have you had any luck with this? The first part of your code that removes the inline css is working for me, but the second part isn't. I'm using 2.7.1, so it's possible something has changed in the media.php file.

    If anyone out there knows how to fix this portion:

    function fix_gallery_output( $output )
    {
    	$output = preg_replace("%</div>%", "</ul>", $output);
    
    	return $output;
    }
    add_filter('the_content', 'fix_gallery_output',11, 1);

    to more specifically replace this output:

    <br style='clear: both;' />
    </div>

    with a simple , I'd be all kinds of psyched.

  3. rfros
    Member
    Posted 5 years ago #

    function fix_gallery_output( $output )
    {
    $output = preg_replace("%<br style=.*clear: both.* />%", "", $output);
    return $output;
    }
    add_filter('the_content', 'fix_gallery_output',11, 1);

    Note: in wp-includes/media.php, wordpress is inconsistent in it's use of single and double quotes

Topic Closed

This topic has been closed to new replies.

About this Topic