Création d'une instance de wp_editor avec des boutons tinyMCE personnalisés

19

Y a-t-il un moyen de définir wp_editor() avec des boutons tinyMCE personnalisés?

J'ai remarqué que la référence de fonction wp_editor indique qu'un des arguments $settings peut être tinymce (array) (optional) Load TinyMCE, can be used to pass settings directly to TinyMCE using an array() .

Ma page utilise un certain nombre d'instances différentes et j'aimerais ajouter certains boutons à certaines instances.

Par exemple,

Instance #1 : Standard buttons
Instance #2 : bold, italic, ul + (custom) pH, temp
Instance #3 : bold, italic, ul + (custom) min_size, max_size

Est-ce que quelqu'un sait comment faire si j'ai déjà enregistré les boutons en tant que plugins tinyMCE comme indiqué dans ce tutoriel ?

MODIFIER

Voici le code que j'utilise dans mon fichier de plugin pour que cela fonctionne:

function add_SF_buttons() {
    if ( ! current_user_can('edit_posts') && ! current_user_can('edit_pages') )
        return;
    if ( get_user_option('rich_editing') == 'true') {
        add_filter('mce_external_plugins', 'add_SF_buttons_plugins');
    }
}

function add_SF_buttons_plugins($plugin_array) {
    $plugin_array['pH'] = $this->plugin_url . '/js/tinymce_buttons/pH.js';
    $plugin_array['pH_min'] = $this->plugin_url . '/js/tinymce_buttons/pH_min.js';
    $plugin_array['pH_max'] = $this->plugin_url . '/js/tinymce_buttons/pH_max.js';
    return $plugin_array;
}

-

if (isset($SpeciesProfile)) {
    add_action( 'init' , array (&$SpeciesProfile, 'register_species' ));
    add_action( 'init' , array( &$SpeciesProfile, 'register_species_taxonomies' ));

    add_action( 'init', array (&$SpeciesProfile, 'add_SF_buttons' ));
}

-

<?php wp_editor( $distribution, 'distribution', array( 'theme_advanced_buttons1' => 'bold, italic, ul, pH, pH_min', "media_buttons" => false, "textarea_rows" => 8, "tabindex" => 4 ) ); ?>

Malheureusement, cela ne fonctionne pas - l'éditeur ci-dessus n'affiche que les mêmes boutons que toutes les autres instances de la page.

Merci d'avance,

    
posée dunc 09.04.2012 - 00:24

4 réponses

13

Vous l’avez à peu près eu, selon la description.

Voici ce que vous recherchez peut-être pour les instances 2 et 3 (par exemple, vous pouvez laisser les paramètres vides pour obtenir l'ensemble de boutons par défaut):

Instance 2:

wp_editor(
    $distribution,
    'distribution',
    array(
      'media_buttons' => false,
      'textarea_rows' => 8,
      'tabindex' => 4,
      'tinymce' => array(
        'theme_advanced_buttons1' => 'bold, italic, ul, pH, temp',
      ),
    )
);

Instance 3 (affichant chacune des 4 lignes que vous pouvez définir pour TinyMCE):

wp_editor(
    $distribution,
    'distribution',
    array(
      'media_buttons' => false,
      'textarea_rows' => 8,
      'tabindex' => 4,
      'tinymce' => array(
        'theme_advanced_buttons1' => 'bold, italic, ul, min_size, max_size',
        'theme_advanced_buttons2' => '',
        'theme_advanced_buttons3' => '',
        'theme_advanced_buttons4' => '',
      ),
    )
);

Je vous recommande de consulter le fichier wp-includes/class-wp-editor.php (plus précisément la fonction editor_settings à la ligne 126) afin de comprendre comment WP analyse les paramètres que vous utilisez dans la fonction wp_editor (). Consultez également cette page pour en savoir plus sur les fonctionnalités de TinyMCE et ses options init (que je ne crois pas WP supporte pleinement).

    
réponse donnée Tomas Buteler 12.04.2012 - 02:01
9

vous pouvez définir les paramètres via array sur la fonction wp_editor (); un exemple

$settings = array(
    'tinymce'       => array(
        'setup' => 'function (ed) {
            tinymce.documentBaseURL = "' . get_admin_url() . '";
        }',
    ),
    'quicktags'     => TRUE,
    'editor_class'  => 'frontend-article-editor',
    'textarea_rows' => 25,
    'media_buttons' => TRUE,
);
wp_editor( $content, 'article_content', $settings ); 

Vous pouvez définir les valeurs via un tableau dans le paramètre 'tinymce', 'tinymce' = > true, // charge TinyMCE, peut être utilisé pour passer les paramètres directement à TinyMCE en utilisant un tableau () En outre, il est possible de se familiariser avec les paramètres des boutons: theme_advanced_buttons1 , theme_advanced_buttons2 , theme_advanced_buttons3 , theme_advanced_buttons4

array( 'theme_advanced_buttons1' => 'bold, italic, ul, pH, temp' )

vous pouvez également obtenir un crochet de filtre pour créer des boutons personnalisés, ainsi qu'un exemple

function fb_change_mce_options($initArray) {
    // Comma separated string od extendes tags
    // Command separated string of extended elements
    $ext = 'pre[id|name|class|style],iframe[align|longdesc|name|width|height|frameborder|scrolling|marginheight|marginwidth|src]';
    if ( isset( $initArray['extended_valid_elements'] ) ) {
        $initArray['extended_valid_elements'] .= ',' . $ext;
    } else {
        $initArray['extended_valid_elements'] = $ext;
    }
    // maybe; set tiny paramter verify_html
    //$initArray['verify_html'] = false;
    return $initArray;
}
add_filter( 'tiny_mce_before_init', 'fb_change_mce_options' );

aussi, vous pouvez filtrer les boutons directement; chaque ligne a chaque filtre: mce_buttons , mce_buttons_2 , mce_buttons_3 , mce_buttons_4

les paramètres suivants sont les paramètres par défaut pour l'exemple raccroché: tiny_mce_before_init

'mode' => 'specific_textareas'
'editor_selector' => 'theEditor'
'width' => '100%'
'theme' => 'advanced'
'skin' => 'wp_theme'
'theme_advanced_buttons1' => 'bold,italic,strikethrough,|,bullist,numlist,blockquote,|,justifyleft,justifycenter,justifyright,|,link,unlink,wp_more,|,spellchecker,fullscreen,wp_adv'
'theme_advanced_buttons2' => 'formatselect,underline,justifyfull,forecolor,|,pastetext,pasteword,removeformat,|,media,charmap,|,outdent,indent,|,undo,redo,wp_help'
'theme_advanced_buttons3' => ''
'theme_advanced_buttons4' => ''
'language' => 'de'
'spellchecker_languages' => 'English=en,Danish=da,Dutch=nl,Finnish=fi,French=fr,+German=de,Italian=it,Polish=pl,Portuguese=pt,Spanish=es,Swedish=sv'
'theme_advanced_toolbar_location' => 'top'
'theme_advanced_toolbar_align' => 'left'
'theme_advanced_statusbar_location' => 'bottom'
'theme_advanced_resizing' => true
'theme_advanced_resize_horizontal' => false
'dialog_type' => 'modal'
'relative_urls' => false
'remove_script_host' => false
'convert_urls' => false
'apply_source_formatting' => false
'remove_linebreaks' => true
'gecko_spellcheck' => true
'entities' => '38,amp,60,lt,62,gt'
'accessibility_focus' => true
'tabfocus_elements' => 'major-publishing-actions'
'media_strict' => false
'paste_remove_styles' => true
'paste_remove_spans' => true
'paste_strip_class_attributes' => 'all'
'wpeditimage_disable_captions' => false
'plugins' => 'safari,inlinepopups,spellchecker,paste,wordpress,media,fullscreen,wpeditimage,wpgallery,tabfocus'

voir sur ce lien pour plus d'informations sur ce filtre.

    
réponse donnée bueltge 12.04.2012 - 13:10
7

Juste pour mettre à jour ceci car je devais creuser dans les fichiers source wp

$settings = array(
    'tinymce' => array(
        'toolbar1' => 'bold, italic',
        'toolbar2' => '',
    ),
    'wpautop' => false,
    'media_buttons' => false,
);

Je pense que cela avait changé avec Tinymce 4.

    
réponse donnée Sam 30.01.2017 - 09:03
1
$args = array(
    'tinymce'       => array(
        'toolbar1'      => 'bold,italic,underline,separator,alignleft,aligncenter,alignright,separator,link,unlink,undo,redo',
        'toolbar2'      => '',
        'toolbar3'      => '',
    ),
);
wp_editor( $content, $editor_id, $args );
    
réponse donnée Mr. HK 14.02.2018 - 08:15

Lire d'autres questions sur les étiquettes