panelindeki biçim seçeneğine özel bir biçim ekleyebilir miyim?


16

Başlıkları ve diğer ayarları ayarlayabileceğiniz metin düzenleyicide, istemcilerin kullanması için kendi stillerinizi eklemek mümkün müdür? ve hatta gereksiz olanları kaldırabilir miyim?


2
WP3 ve TinyMCE bu açıdan çok karışık. CKEditor'daki gibi lanet formatları kolayca eklemenin veya özelleştirmenin mümkün olmadığına inanamıyorum.
cherouvim

1
Katılıyorum, tam bir acı.
Hafif Fuzz

Yanıtlar:


17

: "Klasik" TinyMCE editörü iki dropdowns vardır formatselectiçin paragraf stilleri ve styleselectiçin karakter stilleri - Ayrıca daha kafa karıştırıcı hale getirmek için, paragraf stilleri içerebilir. WordPress'teki yapılandırma varsayılan olarak yalnızca biçim açılır menüsünü gösterir . Editöre özel bir stil sayfası uygularsanız, TinyMCE bunu sınıf adlarını alıp stil açılır menüsüne eklemek için kullanabilir - ancak bu benim için her zaman işe yaramadı.

3.0 yana Arayabileceğin add_editor_style()Gözlerinde farklı functions.phpeditörüne bir stil ekleyin. Varsayılan olarak editor-style.csstema dizininizdedir. 3.0'dan önce mce_cssURL'yi düzenleyici stil sayfanıza eklemek için filtreye bağlanmanız gerekir. Bu , content_cssTinyMCE yapılandırma değeri ile sonuçlanır .

Stil açılır menüsünü eklemek için styleselectseçenek, düğme çubuğu yapılandırma dizilerinden birinde görünmelidir ( theme_advanced_buttons[1-4]TinyMCE'de, mce_buttons_[1-4]WordPress tarafından filtrelenmiştir ). Blok biçimlerinin listesi ile kontrol edilir TinyMCE seçeneği size kontrol diziye ekleyebilir filtresi. Eğer isimlerini özelleştirmek istiyorsanız stil açılır (yalnızca güvenlik CSS sınıf adları), bakmak seçeneği . Stilleri tanımlamak için size daha fazla esneklik sağlayan daha gelişmiş seçeneği de kullanabilirsiniz .theme_advanced_blockformatstiny_mce_before_inittheme_advanced_stylesstyle_formats

Tüm kancalar ve varsayılan yapılandırma ile ilgili PHP kodu olduğunu wp-admin/includes/post.phpişlevinde,wp_tiny_mce() . Hep birlikte, kurulumunuz şöyle görünebilir:

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

.css dosyasının add_editor_style kullanarak alması gereken özel bir biçim var mı? hiçbir şey olmuyor gibi görünüyor
Mild Fuzz

1
@Mild Fuzz: Önceki cevabım yanıltıcıydı çünkü WordPress gerekli iki açılır menüden sadece birini gösteriyor. Cevabımı, ikinci açılır listeyi ve nasıl kontrol edeceğinizi ekleyerek güncelledim.
Jan Fabry

1
@Mild Fuzz: Farklı style_formatsöğelere ait parametreler ilgili formatswiki sayfasında açıklanır .
Jan Fabry

1
longr hata üretmez, ancak etkisi yoktur!
Hafif Fuzz

1
json_encode üretir "değil 'javascript kırılır. str_replace ('" ', "'", json_encode ($ style_formats))
cherouvim

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.