텍스트 패널의 형식 옵션에 사용자 정의 형식을 추가 할 수 있습니까?

제목 및 기타 설정을 지정할 수있는 텍스트 편집기에서 클라이언트가 사용할 고유 스타일을 추가 할 수 있습니까? 심지어 불필요한 것을 제거합니까?

다음 "고전"TinyMCE를 편집기는 두 개의 드롭 다운이 formatselect에 대한 단락 스타일 과 styleselect에 대한 문자 스타일 - 또한 더 혼란하게, 단락 스타일을 포함 할 수 있습니다. 기본적으로 WordPress의 구성에는 형식 드롭 다운 만 표시 됩니다 . 사용자 정의 스타일 시트를 편집기에 적용하면 TinyMCE가이를 사용하여 클래스 이름을 선택하고이를 스타일 드롭 다운에 추가 할 수 있지만 매번 작동하지는 않았습니다.

3.0 이후 당신이 호출 할 수 있습니다 add_editor_style()당신의 functions.php편집기에 스타일 시트를 추가 할 수 있습니다. 기본적으로 editor-style.css테마 디렉토리에 있습니다. 3.0 이전에는 mce_css필터를 사용하여 URL을 편집기 스타일 시트에 추가해야합니다. 이에 종료됩니다 TinyMCE에 구성 값 .content_css

스타일 드롭 다운 을 추가하려면 styleselect버튼 표시 줄 구성 배열 중 하나에 옵션이 나타나야합니다 ( theme_advanced_buttons[1-4]TinyMCE에서는 mce_buttons_[1-4]WordPress로 필터링 됨 ). 블록 형식의 목록에 의해 제어되는 TinyMCE에의 옵션을 당신이에서 컨트롤 배열에 추가 할 수있는, 필터. CSS 클래스 이름뿐만 아니라 스타일 드롭 다운 이름을 사용자 정의 하려면 옵션을보십시오 . 스타일을보다 유연하게 정의 할 수 있는 고급 옵션 을 사용할 수도 있습니다 .theme_advanced_blockformatstiny_mce_before_inittheme_advanced_stylesstyle_formats

모든 후크와 기본 구성이 포함 된 관련 PHP 코드가 wp-admin/includes/post.php작동 중wp_tiny_mce() 입니다. 모두 함께 설정은 다음과 같습니다.

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

여기에서 TinyMCE 형식 드롭 다운은 더 이상 스타일 미리보기를 표시하지 않습니다.

카라가 옳았다면 새 스타일을 보려면 기본 스타일을 설정 해제해야합니다 ...

unset($init['preview_styles']);

return $settings;