Crearea unei instanțe wp_editor cu butoane tinyMCE personalizate
Există vreo modalitate de a defini wp_editor()
cu butoane tinyMCE personalizate?
Am observat că referința funcției wp_editor menționează că unul dintre argumentele $settings
poate fi tinymce (array) (opțional) Încarcă TinyMCE, poate fi folosit pentru a transmite setări direct către TinyMCE folosind un array()
.
Pagina mea folosește mai multe instanțe diferite și aș dori să adaug anumite butoane la anumite instanțe.
De exemplu,
Instanța #1 : Butoane standard
Instanța #2 : bold, italic, ul + (personalizat) pH, temp
Instanța #3 : bold, italic, ul + (personalizat) min_size, max_size
Știe cineva cum aș putea face acest lucru dacă am înregistrat deja butoanele ca plugin-uri tinyMCE conform acestui tutorial?
EDITARE
Iată codul pe care îl folosesc în fișierul meu plugin pentru a face acest lucru să funcționeze:
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 ) ); ?>
Din păcate, acest lucru nu funcționează - editorul de mai sus afișează aceleași butoane ca orice altă instanță din pagină.
Mulțumesc anticipat,
Aproape că ai reușit, conform descrierii.
Iată ce ai putea căuta pentru instanțele 2 și 3 (pentru instanța 1 poți lăsa setările goale pentru a obține setul implicit de butoane):
Instanța 2:
wp_editor(
$distribution,
'distribution',
array(
'media_buttons' => false,
'textarea_rows' => 8,
'tabindex' => 4,
'tinymce' => array(
'theme_advanced_buttons1' => 'bold, italic, ul, pH, temp',
),
)
);
Instanța 3 (afișând fiecare dintre cele 4 rânduri pe care le poți seta pentru 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' => '',
),
)
);
Îți recomand să consulți fișierul wp-includes/class-wp-editor.php
(în special funcția editor_settings
de la linia 126) pentru a înțelege cum WP parsează setările pe care le folosești în funcția wp_editor(). De asemenea, verifică această pagină pentru a înțelege mai multe despre funcționalitatea TinyMCE și opțiunile sale de inițializare (pe care nu cred că WP le suportă pe deplin).

Salut! Mulțumesc pentru răspuns. Am adăugat niște cod în postarea mea originală care, judecând după răspunsul tău, ar trebui să funcționeze - dar nu merge. Poți să arunci o privire?

Am uitat să încapsulez parametrii specifici lui tinymce în propriul lor array. Am editat răspunsul și am adăugat ceilalți parametri pe care i-ai inclus acum în întrebarea ta. Spune-mi cum merge?

Ține minte că și alții (eu inclusiv!) am vrea să știm cum să facem asta singuri, așa că încearcă să nu transformi răspunsul într-unul specific doar pentru dunc. Poți să adaugi link-uri către documentația relevantă WP/TinyMCE?

Grozav, se pare că funcționează. Din păcate, butoanele mele nu funcționează, dar asta e o altă problemă :) Mulțumesc tbuteler.

Cu plăcere! @TomJNowell, am adăugat un ultim paragraf cu lecturi recomandate, mulțumesc pentru sugestie!

Aproape am uitat să-ți acord recompensa :) Am pus o nouă întrebare aici dacă ai vreo idee: http://wordpress.stackexchange.com/questions/48782/registering-custom-tinymce-buttons-for-admin-area-to-work-with-custom-instance

puteți seta parametrii prin intermediul unui array în funcția wp_editor(); un exemplu
$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 );
Puteți seta valorile prin array în parametrul 'tinymce',
'tinymce' => true, // încarcă TinyMCE, poate fi folosit pentru a transmite setări direct către TinyMCE folosind un array()
De asemenea, este posibil să obțineți informații despre parametrii butoanelor:
theme_advanced_buttons1
, theme_advanced_buttons2
, theme_advanced_buttons3
, theme_advanced_buttons4
array( 'theme_advanced_buttons1' => 'bold, italic, ul, pH, temp' )
de asemenea, puteți utiliza un filtru hook pentru a crea butoane personalizate, iată un exemplu
function fb_change_mce_options($initArray) {
// Șir de caractere separat prin virgulă pentru tag-uri extinse
// Șir de caractere separat prin virgulă pentru elemente extinse
$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;
}
// opțional; setează parametrul tiny verify_html
//$initArray['verify_html'] = false;
return $initArray;
}
add_filter( 'tiny_mce_before_init', 'fb_change_mce_options' );
de asemenea, puteți filtra butoanele direct; fiecare linie are propriul filtru:
mce_buttons
, mce_buttons_2
, mce_buttons_3
, mce_buttons_4
următorii parametri sunt cei impliciți pentru exemplul de hook: 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'
consultați acest link pentru mai multe informații despre acest filtru.

Doar pentru a actualiza acest lucru, a trebuit să sap în fișierele sursă wp
$settings = array(
'tinymce' => array(
'toolbar1' => 'bold, italic', // bold, italic
'toolbar2' => '', // bara de unelte 2 goală
),
'wpautop' => false, // dezactivează formatarea automată a paragrafelor
'media_buttons' => false, // dezactivează butoanele media
);
Cred că acest lucru s-a schimbat odată cu Tinymce 4.

$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 );
Acest cod PHP configurează și inițializează editorul TinyMCE în WordPress. Iată explicația parametrilor:
- `$args` - definește setările pentru editor
- `tinymce` - specifică configurația pentru bara de unelte TinyMCE
- `toolbar1` - conține butoanele pentru prima linie de unelte:
* `bold` - îngroșat
* `italic` - cursiv
* `underline` - subliniat
* `separator` - separator vizual
* `alignleft` - aliniere la stânga
* `aligncenter` - aliniere centrată
* `alignright` - aliniere la dreapta
* `link` - inserare link
* `unlink` - eliminare link
* `undo` - anulare acțiune
* `redo` - refacere acțiune
- `toolbar2` și `toolbar3` - sunt lăsate goale (nu conțin butoane)
- `wp_editor()` - funcția WordPress care afișează editorul, primind:
* `$content` - conținutul existent
* `$editor_id` - ID-ul unic al editorului
* `$args` - argumentele de configurare definite mai sus
