Como modificar as opções de diálogo do editor de imagens no WordPress?

Estou tentando ocultar os botões de opção Alinhamento para imagens enviadas para a área de conteúdo da postagem, mas não consigo descobrir como adicionar um arquivo CSS ou JS personalizado à caixa de diálogo Editor de imagem.

Adicionei com êxito um filtro ao gancho de ação tiny_mce_before_init para remover os botões de alinhamento do editor de texto TinyMCE, mas não tenho certeza de como fazer o mesmo com o editor de imagens.

Eu tentei um jQuery hack, mas parece não demorar:

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

Olhando em detalhes, parece que você não pode alterar o editor de imagens apenas em alguns detalhes. A única coisa que você pode fazer é substituir o editor de imagens por uma cópia ligeiramente modificada. Vou explicar em breve como isso pode ser feito.

Mas antes disso uma palavra de aviso. O Editor de imagens está atualmente em (2/2014), portanto, esta solução provavelmente não funcionará a partir da próxima versão do WordPress sem outras modificações.

Uma última observação: seria melhor se você colocasse isso em um plug-in e não no seu tema. De qualquer forma, para tornar essa resposta mais curta, explico como colocar isso no seu tema.

1. Remova o Editor de imagem padrão

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 e altere o Image Editor

Copie wp-includes / js / tinymce / plugins / wpeditimage para sua pasta de temas.

Altere da maneira que quiser. A maneira mais fácil de se livrar das opções de alinhamento seria mudar a linha 55 de

<tr class="align">

para

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

3. Adicione o Editor de imagens 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;
}

A função que você está procurando, para adicionar CSS ao editor do MCE, é chamada add_editor_style . Eu tentei fazer isso funcionar, mas um corte rápido de cinco minutos não funcionou para mim. De acordo com o códice, porém, esse é o caminho certo.

Você pode simplesmente ocultá-lo com o seu CSS. Se o seu tema tiver um arquivo css para o painel do administrador (para formulários personalizados, etc.), adicione-o ao arquivo;

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

Se o seu tema não tiver um arquivo CSS para o painel do administrador, você poderá colocá-lo no functions.phparquivo dos seus temas ;

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

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

Observe que o valor do alinhamento ainda será salvo como antes da edição.