Extra Alignment buttons on media uploader screen

Question

I can not comment on an exciting question because my reputation is too low and when I reply inside that exciting topic it will get deleted because it's not a solution but another question so I start a brand new (same) question. :S

This is the question I'm talking about. Add an alignment option for images

The answer provided by @david.binda is what I think the best solution this far since there isn't a better hook or filter option available for the alignment buttons only.

Till WordPress 4.0.1 it all worked perfectly but upgrading to the latest WordPress 4.1.0 this solution breaks for some reason and I can't find why that is.

This is what it looked like before. Just some extra alignment buttons on the media uploader modal. If you choose LeftSuper it will pull the image on the frontend a little bit outside the content container.

Answer 1

I think your real problem here though is timing, in that you should only do the remove_action and add_action in the wp_enqueue_media action fired at the end of the wp_enqueue_media() function, after it has added the action you're replacing:

add_action( 'wp_enqueue_media', function () {
    if ( ! remove_action( 'admin_footer', 'wp_print_media_templates' ) ) {
        error_log("remove_action fail");
    }
    add_action( 'admin_footer', 'my_print_media_templates' );
} );

(My guess would be that the remove_action() you're doing is actually failing, and that wp_print_media_templates() is still being called, but after your my_print_media_templates(), so that the DOM has two copies of the media templates, but yours wins because it comes first. And though I don't understand why you would have to do your own require_once of "media-template.php", it's a pretty big flashing warning light!)

Also, though this is a personal preference, I'd prefer to manipulate the existing templates (after calling the original wp_print_media_templates()) rather than just copy and paste the whole shabang and edit them. Eg:

function my_print_media_templates() {
    $replaces = array(
        '/<option value="center"/' => '<option value="leftsuper">' . esc_attr__('LeftSuper') . '</option>$0',
        '/<option value="none"/' => '<option value="rightsuper">' . esc_attr__('RightSuper') . '</option>$0',
        '/<button class="button" value="center">/' => '<button class="button" value="leftsuper">' . esc_attr__('LeftSuper') . '</button>$0',
        '/<button class="button active" value="none">/' => '<button class="button" value="rightsuper">' . esc_attr__('RightSuper') . '</button>$0',
    );
    ob_start();
    wp_print_media_templates();
    echo preg_replace( array_keys( $replaces ), array_values( $replaces ), ob_get_clean() );
}

I think this is a bit more maintainable than the copy & paste approach, which is almost guaranteed to go out-of-date on each new release of WP.

Answer 2

GOT IT!

Workflow:

Just copy the default wp_print_media_templates() function and add this inside your theme's functions.php file. The wp_print_media_templates function can be found inside /wp-includes/media-template.php.

Rename the function to my_print_media_templates() - change the code you want to edit. In my case I added some extra alignment buttons.

After that add the following 3 lines of code below, this will remove the default function - it also makes sure to include the original media-template.php file again. Don't know why this is needed but it's needed for some reason. After that, the last line of code adds your custom my_print_media_templates() function to WordPress and this will be used instead of the original WP Core function.

Good luck! This is not beautiful, it's a wall of code to add but I think it's the best way forward until WordPress provide us with more hooks/filters inside the original function.

 *** wall of code here - see: http://pastebin.com/AgCysMdf ***

// remove default wp_print_media_templates from footer
remove_action( 'admin_footer', 'wp_print_media_templates' );

// require the media-template.php again
require_once ABSPATH . WPINC . '/media-template.php';
// add your custom print templates
add_action( 'admin_footer', 'my_print_media_templates' );

This approach works but it's better to use @bonger's solution