Cum includ un editor TinyMCE în frontend?

Question

Cum includ un editor TinyMCE în frontend?

20 mai 2011, 13:26:11

Vizualizări: 36.8K

Voturi: 27

Încerc să adaug un editor TinyMCE în frontend-ul site-ului de unde utilizatorii pot posta, dar până acum nu am reușit. Iată codul:

PHP:

add_action('wp_print_scripts', 'my_enqueue_scripts');

function my_enqueue_scripts() {      
        wp_enqueue_script( 'tiny_mce' );
        if (function_exists('wp_tiny_mce')) wp_tiny_mce();
}

Javascript:

jQuery(document).ready(function(){
tinyMCE.init({
        mode : "textareas",
        theme : "simple", 
        /*plugin-uri : "autolink, lists, spellchecker, style, layer, table, advhr, advimage, advlink, emotions, iespell, inlinepopups, insertdatetime, preview, media, searchreplace, print, contextmenu, paste, directionality, fullscreen, noneditable, visualchars, nonbreaking, xhtmlxtras, template",*/
        editor_selector :"editor"
    });
});

HTML:

<textarea rows="8" cols="40" name="description" id="editor" class="required"><?php echo $description;?></textarea>

Problemă: Editorul de text nu se adaugă la textarea. Cu toate că fișierul JavaScript TinyMCE se încarcă.

Sisir

7.82K

tinymce front end

Comentarii

Poate vei găsi inspirație uitându-te la codul Editorului Frontend

mike23

15 iun. 2011 10:57:24

Toate răspunsurile la întrebare

Comentarii

Da, cu excepția faptului că afișează editorul direct, spre deosebire de a vă permite să-l folosiți într-un shortcode...

random_user_name

5 dec. 2012 05:35:37

Puteți utiliza acest lucru într-un shortcode folosind funcțiile PHP ob_content. Aceste funcții vă permit să captați output-ul într-o variabilă. Astfel: ob_start(); include( static::getTemplatePath() . '/' . $templatePath . '.php'); $template = ob_get_contents(); ob_end_clean(); return $template;

Tosh

2 apr. 2014 17:33:27

editor_selector este folosit pentru a ținti clase, nu id-uri.

De asemenea, când folosești editor_selector, este necesar să setezi mode: "specific_textareas" pentru ca acesta să funcționeze.

Vezi http://tinymce.moxiecode.com/wiki.php/Configuration:editor_selector

Deci JavaScript-ul și HTML-ul tău ar trebui să arate astfel:

jQuery(document).ready(function(){
tinyMCE.init({
        mode : "specific_textareas",
        theme : "simple", 
        /*plugins : "autolink, lists, spellchecker, style, layer, table, advhr, advimage, advlink, emotions, iespell, inlinepopups, insertdatetime, preview, media, searchreplace, print, contextmenu, paste, directionality, fullscreen, noneditable, visualchars, nonbreaking, xhtmlxtras, template",*/
        editor_selector :"tinymce-enabled"
    });
});

<textarea rows="8" cols="40" name="description" id="editor" class="tinymce-enabled required"><?php echo $description;?></textarea>

maryisdead

823

26 iun. 2011 00:15:58

Deși răspunsul lui @maryisdead ar putea fi corect, îți voi da un alt sfat: mai întâi asigură-te că există un singur element în pagina ta cu id="editor", apoi configurează tinymce astfel:

tinyMCE.init({
    ...
    mode : "exact",
    elements : "editor"
});

De asemenea, folosește jQuery în loc de $ în codul tău JavaScript pentru a te asigura că apelezi metodele și selectorii jQuery.

adrian7

316

5 aug. 2011 23:00:59

editor_selector este folosit pentru clase și nu pentru ID-uri.

Valoarea lui editor_selector trebuie utilizată ca nume de clasă pentru elementul textarea.

Franklin Inbaraj

1

29 mar. 2016 08:53:34

Sisir 7.82K · Accepted Answer · 2011-12-12T15:06:00Z

Ei bine, mulțumită WordPress 3.3 acum avem funcția wp_editor() pentru a face asta :)

Sisir

7.82K

12 dec. 2011 15:06:00