Rewrite WP Attachment Images on the Fly

server-patch-panel

At first, this may not seem to have any real-world use, but consider this: You need to set up an independent development environment for your site, and you’d rather not copy gigabytes of files from your production server’s wp-content directory. Without the following function, keeping everything synced could turn into another full-time job, especially if your editorial staff is posting hundreds upon hundreds of articles each day.

Here’s how it works: This filter interrupts the output of wp_get_attachment_image and replaces the returned image tag’s src attribute with your production server’s url, therefore effectively telling the page to read images from a different server than the page is served from.

So here’s the WordPress code that makes it all happen. Put it in a file in your development server’s mu-plugins directory so it doesn’t get overwritten with theme┬ásynchronizations. Remember to swap out “yourserver.com” and “dev.yourserver.com” with appropriate values.

<?php

function rewrite_images( $atts ) {
	$atts['src'] = str_replace( 'dev.yourserver.com', 'yourserver.com', $atts['src'] );
	return $atts;
}
add_filter( 'wp_get_attachment_image_attributes', 'rewrite_images' );

?>

What other creative uses can you think of for this snippet? Leave me a comment below!

4 thoughts on “Rewrite WP Attachment Images on the Fly”

  1. Hi Rich, cheers for this blog it’s just saved me a bit of a headache, Ive used this for a reverse proxy where the images will be hosted on a second server.

    Out of curiosity did this also update blog images for you (through tinymce?) It worked fine for featured images but others didn’t load.

    Cheers again

    Scott

  2. Hi Rich, cheers for this blog it’s just saved me a bit of a headache, Ive used this for a reverse proxy where the images will be hosted on a second server.

    Out of curiosity did this also update blog images for you (through tinymce?) It worked fine for featured images but others didn’t load.

    Cheers again

    Scott

  3. Hey Scott,

    I definitely didn’t account for that scenario when I wrote this little hack. You’re not seeing the other images that you upload because your site is told to load the images from the other domain. It doesn’t know how to differentiate between the images you upload to it, and to the test domain. It always tries to load from the hack instead.

    Hope this helps!

  4. Hey Scott,

    I definitely didn’t account for that scenario when I wrote this little hack. You’re not seeing the other images that you upload because your site is told to load the images from the other domain. It doesn’t know how to differentiate between the images you upload to it, and to the test domain. It always tries to load from the hack instead.

    Hope this helps!

Leave a Reply