Plugin to fix 10px addition in WP image captions

WP Core Devs made a design choice a while ago to impose an arbitrary 10px ‘padding’ on the div that holds images and their captions.

This plugin fixes that

and the code for the plugin is here (as well as hosted on wp.org)

<?php
/**
 * @package FixImageMargins
 * @author Justin Adie
 * @version 0.1.0
 */
/*
Plugin Name: FixImageMargins
Plugin URI: #
Description: removes the silly 10px margin from the new caption based images
Author: Justin Adie
Version: 0.1.0
Author URI: http://rathercurious.net
*/
class fixImageMargins{
    public $xs = 0; //change this to change the amount of extra spacing
 
    public function __construct(){
        add_filter('img_caption_shortcode', array(&$this, 'fixme'), 10, 3);
    }
    public function fixme($x=null, $attr, $content){
 
        extract(shortcode_atts(array(
                'id'    => '',
                'align'    => 'alignnone',
                'width'    => '',
                'caption' => ''
            ), $attr));
 
        if ( 1 > (int) $width || empty($caption) ) {
            return $content;
        }
 
        if ( $id ) $id = 'id="' . $id . '" ';
 
    return '<div ' . $id . 'class="wp-caption ' . $align . '" style="width: ' . ((int) $width + $this->xs) . 'px">'
    . $content . '<p class="wp-caption-text">' . $caption . '</p></div>';
    }
}
$fixImageMargins = new fixImageMargins();
 
?>

14 Comments

RickJune 15th, 2009 at 1:26 am

This plugin was exactly what I needed, and it worked great until the recent WP 2.8 update. Now I’m getting an error message about the plugin not having a valid header?

JustinJune 15th, 2009 at 6:55 am

@Rick, I am getting the same problem and I see from some googling that I am not alone.

The header looks valid to me so there must be something wrong in the wp core. I have not had time to check though. Perhap deleting the phpdoc header might unlock the problem?

RickJune 16th, 2009 at 2:31 am

I actually found a simpler workaround:
Using FTP, I moved the “fixImageMargins” folder outside of the “remove-the-padding-in-images-with-captions” that enclosed it, so the “fixImageMargins” folder is now right inside the plugins folder. After that, WordPress 2.8 didn’t have any issues with the plugin and all is fine again.

dannieAugust 4th, 2009 at 12:02 am

Im not sure if Im doing this right. I downloaded the plug in, but mine is not in a folder called fiximagemargins, the index.php file is sitting inside a folder called “remove-the-padding-in-images-with-captions” with no subfolders. I have put the folder inside the plug ins folder on the server, but when I try to activate it, this is my error message:

Parse error: parse error, unexpected T_STRING, expecting T_OLD_FUNCTION or T_FUNCTION or T_VAR or ‘}’ in /var/www/vhosts/275vegetarianrecipes.com/httpdocs/wp-content/plugins/remove-the-padding-in-images-with-captions/index.php on line 11

does anyone have any advice? we are using wp version 2.8.2

JustinAugust 4th, 2009 at 10:45 am

@dannie are you perhaps using php 4 rather than php5?

NAugust 6th, 2009 at 4:01 am

I’m trying to use the plugin with PHP 4. Is that possible?

JustinAugust 12th, 2009 at 8:35 am

@n
no it is not possible

CoreyAugust 20th, 2009 at 9:32 pm

I’m getting the same error as dannie but I am using php 5

CoreyAugust 20th, 2009 at 9:52 pm

i take that back. i only thought i was using php 5 but apparently my attempt at an upgrade never actually worked. finally upgraded and all good now. thanks!

Giraldi MaggioDecember 23rd, 2009 at 3:12 pm

For those who had to use PHP4, you can resort to this instead:

http://wpengineer.com/filter-caption-shortcode-in-wordpress/

C. Spencer BeggsFebruary 17th, 2010 at 6:01 pm

This plugin is a great fix for such an annoying WordPress bug. I noticed that the 10px is also added to images inside the WYSIWYG editor. Is there a way to filter the output in TinyMCE as well?

JustinFebruary 18th, 2010 at 3:12 pm

Hi Spencer
it’s not a bug i’m afraid. it’s a deliberate style choice applied by the core devs.
the code is at line 623 of wp-includes/media.php.

when you say ‘filter the output in TinyMCE’ can you give me an example? the img_caption_shortcode is the only place i have found where the arbitrary 10px is included.

JustinFebruary 18th, 2010 at 3:13 pm

for those wanting to you this plugin with php4, i was perhaps overly trite in my response that you could not do so.

wherever you see the words ‘public function’, delete the word public. and change public $xs to var $xs. those changes should make php4 play nice too.

JustinFebruary 18th, 2010 at 3:53 pm

@Spencer (again)
in case you are talking about the gallery function, i believe the top 10px margin is injected via a css rule.
you can filter this at the post_gallery level or just the css at the gallery_style hook

Leave a comment

Your comment