Changing classes from image attachment DIV

When embeding an image with caption into a post or page WordPress assigns an ID and a Style with a width to the DIV which surrounds the image with caption. It outputs the following code:

<div id="attachment_45" class="wp-caption alignnone" style="width: 510px">
	<img class="size-full wp-image-45 " title="1029" 
        src="http://www.example.com/linkto.jpg" alt="Alt_Text"
        width="500" height="500" />
	<p class="wp-caption-text">Caption Text</p>
</div>


This is the way to just assign own class to the surrounding DIV, no class to the image and no Paragraph tag for the caption text.

Simple, just adding the below code to functions.php.

<?php
/*
 * Change default image caption output
 */
add_shortcode('wp_caption', 'fixed_img_caption_shortcode');
add_shortcode('caption', 'fixed_img_caption_shortcode');
function fixed_img_caption_shortcode($attr, $content = null) {
	// Allow plugins/themes to override the default caption template.
	$output = apply_filters('img_caption_shortcode', '', $attr, $content);
	if ( $output != '' ) return $output;
	extract(shortcode_atts(array(
		'id'=> '',
		'align'	=> 'alignnone',
		'width'	=> '',
		'caption' => ''), $attr));
	if ( 1 > (int) $width || empty($caption) )
	return $content;
	if ( $id ) $id = 'id="' . esc_attr($id) . '" ';
	return '<div ' . 'class="wp-caption ' . esc_attr($align)
	. '">'
	. do_shortcode( $content )
	. $caption . '</div>';
}
?>

Than the result will be like this:

<div class="wp-caption alignnone">
	<img class="size-full wp-image-45 " title="1029"
        src="http://www.example.com/linkto.jpg" alt="Alt_Text"
        width="500" height="500" />
	<p class="wp-caption-text">Caption Text</p>
</div>

Source: http://wordpress.org/support/topic/changing-classes-and-surrounding-paragraph-tag-from-image-attachment-div

You may also like...