Wednesday, May 12, 2010

TinyMCE HTML editor with Word Character count

Code Snippet






tinyMCE.init({
// General options

mode : "textareas",
theme : "advanced",
plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,spellchecker,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,htmlcharcount",

// Theme options
theme_advanced_buttons1 : "bold,italic,|,undo,redo,|,sub,sup,|,charmap,spellchecker,|",
theme_advanced_buttons2 : "",
theme_advanced_buttons3 : "",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
// Example content CSS (should be your site CSS)
content_css : "css/example.css",
// Drop lists for link/image/media/template dialogs
template_external_list_url : "js/template_list.js",
external_link_list_url : "js/link_list.js",
external_image_list_url : "js/image_list.js",
media_external_list_url : "js/media_list.js",
theme_advanced_path : false,
setup : function(ed) {
ed.onKeyPress.add(function(ed, e) {
var strip = (tinyMCE.activeEditor.getContent()).replace(/(<([^>]+)>)/ig,"");
var text = '';
if(strip.length <= 4000)
{
text = strip.split(' ').length + " Words, " + strip.length + "/4000 Characters";
tinymce.DOM.setHTML(tinymce.DOM.get(tinyMCE.activeEditor.id + '_path_row'), text);
}
else
{
text = strip.split(' ').length + " Words, " + strip.length + "/4000 Characters";
tinyMCE.activeEditor.dom.setStyle(tinyMCE.activeEditor.id + '_path_row', 'color', 'red');
tinymce.DOM.setHTML(tinymce.DOM.get(tinyMCE.activeEditor.id + '_path_row'), text);
}
});
}
});

3 comments:

  1. Your word count is wrong. It does not work at all

    ReplyDelete
  2. Works great, thanks.

    ReplyDelete
  3. There is a plugin for counting characters and words:
    http://adamscheller.com/tinymce-count-characters-plugin/

    ReplyDelete