posso adicionar um formato personalizado à opção de formato no painel de texto?

No editor de texto, onde você pode definir cabeçalhos e outras configurações, é possível adicionar seus próprios estilos para os clientes usarem? e até remover os desnecessários?

O editor "clássico" do TinyMCE possui duas listas suspensas: formatselectpara estilos de parágrafo e styleselectpara caracteres - que também podem conter estilos de parágrafo, para torná-lo mais confuso. A configuração no WordPress, por padrão, mostra apenas a lista suspensa de formatos . Se você aplicar uma folha de estilo personalizada ao editor, o TinyMCE poderá usá-la para selecionar os nomes de classe e adicioná-los à lista suspensa de estilos - mas isso não funcionou sempre para mim.

Desde 3.0 você pode chamar add_editor_style()em sua functions.phppara adicionar uma folha de estilo para o editor. Por padrão, está editor-style.cssno seu diretório de temas. Antes do 3.0, você precisa se conectar ao mce_cssfiltro para adicionar o URL à sua folha de estilo do editor. Isso vai acabar emcontent_css valor de configuração do TinyMCE .

Para adicionar o estilo suspenso, a styleselectopção deve aparecer em uma das matrizes de configuração da barra de botões ( theme_advanced_buttons[1-4]no TinyMCE, filtrado por mce_buttons_[1-4]WordPress). A lista de formatos de blocos é controlada pela theme_advanced_blockformatsopção de TinyMCE , que você pode adicionar à matriz de controle no tiny_mce_before_initfiltro. Se você quiser personalizar os nomes do estilo suspensa (não apenas seus nomes de classe CSS), olhar para a theme_advanced_stylesopção . Você também pode usar o mais avançadostyle_formats opção que oferece mais flexibilidade para definir os estilos.

O código PHP relevante com todos os ganchos e configuração padrão está em wp-admin/includes/post.php, em funçãowp_tiny_mce() . No conjunto, sua configuração pode ficar assim:

add_action( 'after_setup_theme', 'wpse3882_after_setup_theme' );
function wpse3882_after_setup_theme()
{
    add_editor_style();
}

add_filter('mce_buttons_2', 'wpse3882_mce_buttons_2');
function wpse3882_mce_buttons_2($buttons)
{
    array_unshift($buttons, 'styleselect');
    return $buttons;
}

add_filter('tiny_mce_before_init', 'wpse3882_tiny_mce_before_init');
function wpse3882_tiny_mce_before_init($settings)
{
    $settings['theme_advanced_blockformats'] = 'p,h1,h2,h3,h4';

    // From http://tinymce.moxiecode.com/examples/example_24.php
    $style_formats = array(
        array('title' => 'Bold text', 'inline' => 'b'),
        array('title' => 'Red text', 'inline' => 'span', 'styles' => array('color' => '#ff0000')),
        array('title' => 'Red header', 'block' => 'h1', 'styles' => array('color' => '#ff0000')),
        array('title' => 'Example 1', 'inline' => 'span', 'classes' => 'example1'),
        array('title' => 'Example 2', 'inline' => 'span', 'classes' => 'example2'),
        array('title' => 'Table styles'),
        array('title' => 'Table row 1', 'selector' => 'tr', 'classes' => 'tablerow1'),
    );
    // Before 3.1 you needed a special trick to send this array to the configuration.
    // See this post history for previous versions.
    $settings['style_formats'] = json_encode( $style_formats );

    return $settings;
}

Conforme aqui , o menu suspenso do formato TinyMCE não mostra mais visualizações de estilo

Kara acertou, você precisa desabilitar os estilos padrão para ver os novos estilos ...

unset($init['preview_styles']);

return $settings;