czy mogę dodać niestandardowy format do opcji formatu w panelu tekstowym?

Czy w edytorze tekstu, w którym można ustawić nagłówki i inne ustawienia, można dodawać własne style do użytku przez klientów? a nawet usunąć niepotrzebne?

„Klasyczny” edytor TinyMCE ma dwie listy rozwijanej: formatselectdla stylów akapitu i styleselectdla stylów znaków - który może zawierać także stylów akapitów, aby uczynić go bardziej mylące. Konfiguracja w WordPress domyślnie pokazuje tylko menu rozwijane formatu . Jeśli zastosujesz niestandardowy arkusz stylów do edytora, TinyMCE może go użyć do pobrania nazw klas i dodania ich do listy rozwijanej stylu - ale nie zawsze działało to dla mnie.

Od wersji 3.0 możesz dzwonić add_editor_style()w functions.phpcelu dodania arkusza stylów do edytora. Domyślnie znajduje się editor-style.cssw katalogu motywów. Przed wersją 3.0 musisz podpiąć się do mce_cssfiltra, aby dodać adres URL do arkusza stylów edytora. W ten sposób kończy się w tej content_csswartości konfiguracji TinyMCE .

Aby dodać menu rozwijane stylu , styleselectopcja musi pojawić się w jednej z tablic konfiguracji paska przycisków ( theme_advanced_buttons[1-4]w TinyMCE, filtrowane według mce_buttons_[1-4]w WordPress). Lista formatów blokowych jest kontrolowany przez z theme_advanced_blockformatsopcją TinyMCE , który można dodać do tablicy kontrolnej w tiny_mce_before_initfiltrze. Jeśli chcesz dostosować nazwy rozwijanego stylu (nie tylko nazwy klas CSS), spójrz na tę theme_advanced_stylesopcję . Możesz także użyć bardziej zaawansowanej style_formatsopcji, która daje większą elastyczność w definiowaniu stylów.

Odpowiedni kod PHP ze wszystkimi zaczepami i domyślną konfiguracją jest wp-admin/includes/post.phpwłączonywp_tiny_mce() . Wszystko razem może wyglądać tak:

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;
}

Zgodnie z tym menu rozwijanym format TinyMCE nie wyświetla już podglądów stylów

Kara miała rację, musisz zmienić domyślne style, aby zobaczyć nowe style ...

unset($init['preview_styles']);

return $settings;