• Resolved Doodlebee


    Hey all,

    I’m trying to edit the output that the “add media” button adds to a post when you’re writing it. I’m fairly successful so far, but I’m having an issue with two items in the function.

    So basically, I’m just altering the get_image_tag() (from media.php) to add some extra sans and such to the image in question. I’ve got it working, insofar as the function work, and it returns the new additions as you’re writing the post. However, I can’t seem to obtain the size and alignment of what’s being posted.

    Here’s what I have so far:

    add_filter('get_image_tag', 'add_image_frames', 10, 2);
    function add_image_frames($html, $id, size="medium") {
    	list($img_src, $width, $height) = image_downsize($id, $size);
    	$before = '<div class="image_frame align"><div style="background-image: url(\'' . esc_attr($img_src) . '\');"><span>';
    	$after = '</span></div></div>';
    	$html = $before . $html . $after;
    	return $html;

    So this is working great: when you click the “upload media” button while writing a post, and then insert it into the post, the <image> stuff is edited to add my “image_frame” div around it (and applies the actual image URL as the background style of the div). However, for the life of me, I cannot pull the proper size (it defaults to the one I gave it: “medium”, and although the <image> changes to the correct size, the size places in the div I’m adding remains at medium). If I remove the $size=”medium” from the function, then it reverts to “medium” anyway (because that’s the default for the function).

    I also want to detect what alignment is given – alignleft, alignright – whatever – and add that to the “image_frame” div. But so far, it doesn’t add it either. For the life of me, I can’t figure out how to make this function grab what size and alignment is being chosen by the end user, and have it applied to my altered output. It just comes up blank every time.

    Would anyone happen to know what I need to do to grab that information?

Viewing 3 replies - 1 through 3 (of 3 total)
  • this seems to work:

    (no idea why – just did a bit of trial and error and logical deduction by looking at the code in /media.php around line 228)

    btw: in the visual editor, if I delete an image from the post content which was inserted with the filter active, there is some residual code left over; example:

    <div class="image_frame alignright size-medium">
    <div style="background-image: url('http://localhost/wordpress/wp-content/uploads/2010/05/birthday_cake-225x204.jpg');"></div>

    Thread Starter Doodlebee


    Oh sweet! I’ll give that a shot 🙂 I appreciate it. And I didn’t even think of residuals – I’ll look into that. Thanks for letting me know!

    Thread Starter Doodlebee


    Awesome! You are my hero of the day (granted, it’s the end of the day, so this title will officially carry over to tomorrow!). I could have sworn I tried that before, but it didn’t work – then I realized I was using the esc_attr() stuff. You’re not. It works fine!

    I made a few edits, and this is the final code I came up with:

    [Code moderated as per the Forum Rules. Please use the pastebin]

    it works *wonderfully*. I’m happy-dancing like crazy. I do still need to sort out the visual editor issue, but since most people I do this stuff for (including me!) never use it, I’m not too concerned about it.

    Thanks SO much!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Editing image output with get_image_tag()’ is closed to new replies.