Use rich text editor in comments?

The question:

I’ve been trying to get the TinyMCE editor working in the comments field but I’ve been unable to do so. Another suggestion I found was, the editor is working but the comments are not saved in rich text.

TinyMCEComments seems to do it but hasn’t been updated in a while, it’s not working for 3.2.

Did anybody got this working? Thanks!

The Solutions:

Below are the methods you can try. The first solution is probably the best. Try others if the first one doesn’t work. Senior developers aren’t just copying/pasting – they read the methods carefully & apply them wisely to each case.

Method 1

Solved it myself by loading tinymce in the header:


This will include the TinyMCE javascript. Then simply use TinyMCE as you wish

<script type="text/javascript">
    mode : "textareas",
    theme : "advanced",
    plugins : "autolink,lists,spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template",

    theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontselect,fontsizeselect",
    theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
    theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
    theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,spellchecker,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,blockquote,pagebreak,|,insertfile,insertimage",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    theme_advanced_resizing : true,

    skin : "o2k7",
    skin_variant : "silver",

Method 2

Unfortunately your solution has a bug. TinyMCE stops working when used with threaded comments and user clicks reply. This is because it can’t be moved around in DOM. TinyMCE must be removed from DOM before comment form is moved on reply and added back after comment form is in place. The same thing needs to be done when/if user clicks cancel reply. I posted a bunch of code for WordPress > 3.3 with two ways to solve this problem in an article on my blog:

Also my solution makes it possible to use both TinyMCE (Visual) or Quicktags(HTML) editor or both using WordPress 3.3 wp_editor() function.

All methods was sourced from or, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Comment