¿Cómo modificar las opciones de diálogo del editor de imágenes en WordPress?

Estoy tratando de ocultar los botones de opción Alineación para las imágenes cargadas en el área de contenido de la publicación, pero no puedo encontrar la manera de agregar un archivo CSS o JS personalizado al cuadro de diálogo Editor de imágenes.

Agregué con éxito un filtro al gancho de acción tiny_mce_before_init para eliminar los botones de alineación del editor de texto TinyMCE, pero no estoy seguro de cómo hacer lo mismo con el editor de imágenes.

He intentado un hack de jQuery, pero parece que no toma:

$('.mceWrapper iframe').load( function() {
    $(this).contents().find('tr.align').hide();
});

Mirándolo en detalle, parece que no puedes alterar el editor de imágenes solo con algunos detalles. Lo único que puede hacer es reemplazar el editor de imágenes con una copia ligeramente modificada. Explicaré brevemente cómo se puede hacer esto.

Pero antes de eso una palabra de advertencia. Actualmente se está trabajando en el Editor de imágenes (2/2014), por lo que esta solución probablemente no funcionará desde la próxima versión de WordPress sin más modificaciones.

Una última nota: sería mejor si pusieras esto en un complemento y no en tu tema. De todos modos, para acortar esta respuesta, explico cómo poner esto en su tema.

1. Eliminar el editor de imágenes predeterminado

add_filter( 'tiny_mce_plugins', 'remove_wpeditimage', 10, 2 );

function remove_wpeditimage($plugins){
    if(($key = array_search('wpeditimage', $plugins)) !== false) {
        unset($plugins[$key]);
    }
    if(($key = array_search('teeny_mce_plugins', $plugins)) !== false) {
        unset($plugins[$key]);
    }
    return $plugins;
}

2. Copie y cambie el Editor de imágenes

Copie wp-includes / js / tinymce / plugins / wpeditimage a su carpeta de temas.

Modifícalo como quieras. La forma más fácil de deshacerse de las opciones de alineación sería cambiar la línea 55 de

<tr class="align">

a

<tr class="align" style="display:none;">

3. Agregue el editor de imágenes alterado

add_filter('mce_external_plugins', 'add_customized_wpeditimage');

function add_customized_wpeditimage($plugins) {
    $plugins[ 'wpeditimage' ] = get_template_directory_uri() . '/wpeditimage/editor_plugin.js';
    return $plugins;
}

La función que está buscando para agregar CSS al editor MCE se llama add_editor_style . Intenté hacer que esto funcionara, pero un truco rápido de cinco minutos no funcionó para mí. Sin embargo, según el códice, esa es la forma correcta de hacerlo.

Puedes ocultarlo con tu CSS. Si su tema tiene un archivo CSS para su panel de administración (para formularios personalizados, etc.), simplemente agregue esto a ese archivo;

#img-edit tr.align { display:none; }

Si su tema no tiene un archivo CSS para el panel de administración, puede colocarlo en el functions.phparchivo de sus temas ;

add_action( 'admin_head', 'so4513579_hide-img-alignment' );

function so4513579_hide-img-alignment() {
    echo "<style> #img-edit tr.align { display:none; } </style>";
}

Tenga en cuenta que el valor de alineación se guardará como lo que sea antes de la edición.