Difference: TinyMCEPlugin (r8 vs. r7)

TinyMCEPlugin

Introduction

This is an integration of the TinyMCE WYSIWYG editor. This is great little editor, fast and highly functional, and supporting a wide range of browsers, including Firefox, IE and Safari. At the time of writing it doesn't work with Opera or Konqueror.

The integration uses the TWiki:Plugins.WysiwygPlugin to translate text to and from a format that TinyMCE can edit.

Unlike the other editor integrations in TWiki, which install "Word in a Browser" style editors, this plugin is able to swap out the standard text areas in an edit and replace them with WYSIWYG editors. This means you get WYSIWYG editors for textareas in forms, as well as for the main text of the topic. It can also co-exist alongside other WYSIWYG editors, such as Kupu.

The editor automatically "switches itself off" (i.e. reverts to the old text-only window) when editing topics that contain TWiki content it can't handle, such as complex TWiki variables.

Editor Notes

The editor uses a translator module to convert from TWiki markup language (TML) to HTML and back. The translator converts special TWiki tags - such as %VARIABLES% - to plain text, and encloses them within HTML spans using a special style called WYSIWYG_PROTECTED. In this way the editor can detect text that is not meant to be HTML formatted. This style is also used to protect special text you enter into the editor from being interpreted when the topic is translated back into TML. If you want to add any special TWiki features that are sensitive to formatting, such as Set statements, then you have to format those regions using 'Protect on save' or 'Protect forever'.

Installation Instructions

NOTES:

  • This plugin comes pre-installed on TWiki. You should only need to re-install if there is an upgrade to the plugin.
  • It requires the very latest revision of WysiwygPlugin. It will not work with the version shipped with TWiki 4.1.2.
  • When installed, it replaces the old "textarea" editor. If you want to maintain access to the old editor from the standard screens, follow the instructions under Configuring the buttons on TWiki < 4.2.0.

First follow the installation instructions to install the Plugin:

You do not need to install anything in the browser to use this extension. The following instructions are for the administrator who installs the extension on the server where TWiki is running.

Like many other TWiki extensions, this module is shipped with a fully automatic installer script written using the BuildContrib.

  • If you have TWiki 4.2 or later, you can install from the configure interface (Go to Plugins->Find More Extensions)
  • If you have any problems, then you can still install manually from the command-line:
    1. Download one of the .zip or .tgz archives
    2. Unpack the archive in the root directory of your TWiki installation.
    3. Run the installer script ( perl <module>_installer )
    4. Run configure and enable the module, if it is a plugin.
    5. Repeat for any missing dependencies.
  • If you are still having problems, then instead of running the installer script:
    1. Make sure that the file permissions allow the webserver user to access all files.
    2. Check in any installed files that have existing ,v files in your existing install (take care not to lock the files when you check in)
    3. Manually edit LocalSite.cfg to set any configuration variables.

Settings

You can override this setting by defining TINYMCEPLUGIN_DEBUG to enable some simple debug features.

  • Set DEBUG = 0

This setting contains all the options passed to the TinyMCE editor on startup. For a full explanation of the available options, and guidance on reconfiguring TinyMCE, see the Moxicode TinyMCE Wiki. Note the inclusion of the Pattern Skin standard CSS files in the content_css setting.

   * Set INIT = mode:"textareas",
   editor_selector : "twikiTextarea",
   save_on_tinymce_forms: true,
   cleanup : true,
   theme : "advanced",
   convert_urls : true,
   relative_urls : false,
   remove_script_host : false,
   setupcontent_callback : TWikiTiny.setUpContent,
   urlconverter_callback : "TWikiTiny.convertLink",
   hide_instance_callback : TWikiTiny.switchToRaw,
   show_instance_callback : TWikiTiny.switchToWYSIWYG,
   twikipuburl_callback : "TWikiTiny.convertPubURL",
   save_callback : "TWikiTiny.saveCallback",
   %IF{"$TINYMCEPLUGIN_DEBUG" then="debug:true,"}%
   plugins : "table,searchreplace,autosave,paste,twikibuttons,twikiimage%IF{"$TINYMCEPLUGIN_DEBUG" then=",devkit"}%",
   twiki_secret_id : "%WYSIWYG_SECRET_ID%",
   twiki_vars : { PUBURLPATH : "%PUBURLPATH%", PUBURL : "%PUBURL%", WEB : "%WEB%", TOPIC : "%TOPIC%", ATTACHURL : "%ATTACHURL%", ATTACHURLPATH : "%ATTACHURLPATH%", VIEWSCRIPTURL : "%SCRIPTURL{view}%", SCRIPTSUFFIX: "%SCRIPTSUFFIX%", SCRIPTURL : "%SCRIPTURL%" },
   theme_advanced_toolbar_align : "left",
   twikibuttons_formats : [
   { name: "Normal", el: "", style: null },
   { name: "Heading 1", el: "h1", style: false },
   { name: "Heading 2", el: "h2", style: false },
   { name: "Heading 3", el: "h3", style: false },
   { name: "Heading 4", el: "h4", style: false },
   { name: "Heading 5", el: "h5", style: false },
   { name: "Heading 6", el: "h6", style: false },
   { name: "VERBATIM", el: "pre", style: "TMLverbatim" },
   { name: "LITERAL", el: "span", style: "WYSIWYG_LITERAL" },
   { name: "Protect on save", el: null, style: "WYSIWYG_PROTECTED" },
   { name: "Protect forever", el: null, style: "WYSIWYG_STICKY" }
   ],
   paste_create_paragraphs : true,
   paste_create_linebreaks : false,
   paste_convert_middot_lists : true,
   paste_convert_headers_to_strong : false,
   paste_remove_spans: true,
   paste_remove_styles: true,
   paste_strip_class_attributes: "all",
   theme_advanced_buttons1 : "twikiformat,separator,bold,italic,tt,colour,removeformat,separator,bullist,numlist,outdent,indent,separator,link,unlink,anchor,separator,attach,image,charmap,hr,separator,undo,redo,separator,search,replace",
   theme_advanced_buttons2: "tablecontrols,separator,code,hide",
   theme_advanced_buttons3: "",
   theme_advanced_toolbar_location: "top",
   theme_advanced_resize_horizontal : false,
   theme_advanced_resizing : true,
   theme_advanced_path: false,
   theme_advanced_statusbar_location : "bottom",
   content_css : "%PUBURLPATH%/%SYSTEMWEB%/TinyMCEPlugin/wysiwyg%IF{"$TINYMCEPLUGIN_DEBUG" then="_src"}%.css,%PUBURLPATH%/%SYSTEMWEB%/TWikiTemplates/base.css,%TWIKISTYLEURL%,%TWIKICOLORSURL%"
  • Additional settings for specific browsers.
    • Warning: if you enable paste_auto_cleanup_on_paste then it automatically implies =past_use_dialog on all non-MSIE browsers.
    • Set INIT_MSIE = paste_auto_cleanup_on_paste : true
    • Set INIT_OPERA =
    • Set INIT_GECKO =
    • Set INIT_SAFARI =

You can override these settings in the same way as any other TWiki variable, by setting e.g. TINYMCEPLUGIN_INIT in the site, web or topic preferences. You are not recommended to edit the setting here.

  • You can disable the plugin in any web or topic, or for any specific user, by setting the TINYMCEPLUGIN_DISABLEvariable preferences setting to 1.
    • Alternatively (preferred), you can give the user an option to use the WYSIWYG editor or raw editor with the EDITMETHOD preferences setting set to wysiwyg (default) or raw.
  • Some browsers don't support TinyMCE. You can prevent the editor from being invoked on these browsers by setting TINYMCEPLUGIN_BAD_BROWSERS to a regular expression that matches the user-agent string for any broken browsers. The default is (?i-xsm:Konqueror|Opera).

The global TWiki Variable WYSIWYG_EXCLUDE can be set to make the plugin sensitive to what is in a topic, before allowing it to be edited. You can set it up to veto an edit if the topic contains:

  • html - HTML tags (e.g. <div>, not including <br>), or
  • variables - simple variables (e.g. %VAR%) or
  • calls - TWiki variables with parameters e.g. %VARIABLE{...}%
  • pre blocks (<pre>)
  • HTML comments (<!-- ... -->)

If the plugin detects an excluded construct in the topic, it will refuse to allow the edit and will redirect to the default editor.

If you excluded calls in WYSIWYG_EXCLUDE, you can still define a subset of TWiki variables that do not block edits. this is done in the global TWiki variable WYSIWYG_EDITABLE_CALLS, which should be a list of TWiki variable names separated by vertical bars, with no spaces, e.g: * Set WYSIWYG_EDITABLE_CALLS = COMMENT|CALENDAR|INCLUDE

You should set WYSIWYG_EXCLUDE and WYSIWYG_EDITABLE_CALLS in TWikiPreferences, or in WebPreferences for each web.

You can define the global variable WYSIWYGPLUGIN_STICKYBITS to stop the plugin from ever trying to convert specific HTML tags into HTML when certain specific attributes are present on the tag. This is most useful when you have styling or alignment information in tags that must be preserved.

This variable is used to tell the translator which attributes, when present on a tag, make it "stick" i.e. block conversion. For example, setting it to table=background,lang;tr=valign will stop the translator from trying to handle any table tag that has background or lang attributes, and any tr tag that has a valign attribute.

You can use perl regular expressions to match tag and attribute names, so .*=id,on.* will ensure that any tag with an on* event handler is kept as HTML.

The default setting for this variable is:

    .*=id,lang,title,dir,on.*;
    A=accesskey,coords,shape,target;
    BDO=dir;
    BR=clear;
    COL=char,charoff,span,valign,width;
    COLGROUP=align,char,charoff,span,valign,width;
    DIR=compact;
    DIV=align;
    DL=compact;
    FONT=size,face;
    H\d=align;
    HR=align,noshade,size,width;
    LEGEND=accesskey,align;
    LI=type,value;
    OL=compact,start,type;
    P=align;
    PARAM=name,type,value,valuetype;
    PRE=width;
    Q=cite;
    TABLE=align,bgcolor,border,cellpadding,cellspacing,frame,rules,summary,width;
    TBODY=align,char,charoff,valign;
    TD=abbr,align,axis,bgcolor,char,charoff,colspan,headers,height,nowrap,rowspan,scope,valign,width;
    TFOOT=align,char,charoff,valign;
    TH=abbr,align,axis,bgcolor,char,charoff,colspan,height,nowrap,rowspan,scope,valign,width,headers;
    THEAD=align,char,charoff,valign;
    TR=bgcolor,char,charoff,valign;
    UL=compact,type

If you edit using the plain-text editor, you can use the <sticky>..</sticky> tags to delimit HTML (or TML) that you do not want to be WYSIWYG edited.

Configuring the buttons on TWiki < 4.2.0

When installed on TWiki versions before 4.2.0, this plugin replaces the old textarea editor with the TinyMCE editor. The shock of this change can be too much for some older contributors, so we have written instructions for reconfiguring your templates in TWiki:Plugins.TinyMCEFrequentlyAskedQuestions.

Plugin Info

Many thanks to the following sponsors for supporting this work:

Plugin Author: TWiki:Main.CrawfordCurrie
Copyright: © 2007-2008 Crawford Currie http://c-dot.co.uk,
© 2007-2010 TWiki:TWiki/TWikiContributor
  This package also includes the complete sources for version 3.2.4.1 of the TinyMCE editor
License: GPL (Gnu General Public License)
Plugin Version: 2010-04-24 18853 (2010-05-29) 2010-11-05 20914 (2011-05-03)
Change History:  
2010-04-24 2010-11-05 TWikibug:Item6433 TWikibug:Item6604 : Doc improvements, Add documentation prepare for TWiki 5.0 EDITMETHOD setting release
2009-09-08 2010-04-24 TWikibug:Item6334 TWikibug:Item6433 : Upgrade plugin to latest TinyMCE version 3.2.4.1 Doc improvements, prepare for TWiki 5.0 release from 2.1.1.1 -- TWiki:Main/SopanShewale
03 2009-09-08 Aug 2008 TWiki 4.2.1 release version TWikibug:Item6334: Upgrade plugin to latest TinyMCE version 3.2.4.1 from 2.1.1.1 -- TWiki:Main/SopanShewale
04 May 03 Aug 2008 TWikibug:Item5547 TWiki 4.2.1 release version : Change mechanism by which TMCE recognises textareas to camp on. Use class instead of element name.
12 Apr 04 May 2008 TWikibug:Item4946 TWikibug:Item5547 : I think I have finally fixed non-iso-8859-1 character sets. Painful. Change mechanism by which TMCE recognises textareas to camp on. Use class instead of element name.
31 Mar 12 Apr 2008 TWikibug:Item5314 TWikibug:Item4946 : I think I have finally fixed non-iso-8859-1 character sets. Painful. TWikibug:Item5457: Fixed pickaxe mode for editing UTF-8. Characters above 255 are converted to entitites, which is a bit of a PITA, but at least it no longer corrupts topics. NOTE: YOU MUST UPGRADE WysiwygPlugin TO 16600 OR LATER
28 31 Mar 2008 TWikibug:Item5432 TWikibug:Item5314 : added upper case file extensions for images TWikibug:Item5206 TWikibug:Item5457 : fixed expansion Fixed pickaxe mode for editing UTF-8. Characters above 255 are converted to entitites, which is a bit of simple filenames entered in image popup a PITA, but at least it no longer corrupts topics. TWikibug:Item5462NOTE: YOU MUST UPGRADE WysiwygPlugin TO 16600 OR LATER: fixed hide attachment switch
25 Jan 28 Mar 2008 TWikibug:Item5287 TWikibug:Item5432 : links entered through dialog weren't working added upper case file extensions for images TWikibug:Item5206: fixed expansion of simple filenames entered in image popup TWikibug:Item5462: fixed hide attachment switch
24 25 Jan 2008 TWikibug:Item4840 TWikibug:Item5287 : links entered through dialog weren't working TWikibug:Item5138: UTF8 fixes, TWikibug:Item5022: made TT font size same as verbatim. Had to add a new style to do it, as TMCE didn't want to play with TT or CODE tags. TWikibug:Item5138: post-conversion of 8-bit entities to characters to aid searching, TWikibug:Item5254: non-fatal JS error fixed, TWikibug:Item5263: remove preview on WYSIWYG edit, TWikibug:Item5116: added Opera to bad browsers filter
20 Dec 2007 24 Jan 2008 TWikibug:Item5047 TWikibug:Item4840 : disable save and preview during page load TWikibug:Item5111 TWikibug:Item5138 : make the UTF8 fixes, entry in the format menu sensitive to where the cursor is TWikibug:Item5022: made TT font size same as verbatim. Had to add a new style to do it, as TMCE didn't want to play with TT or CODE tags. TWikibug:Item5138: post-conversion of 8-bit entities to characters to aid searching, TWikibug:Item5254: non-fatal JS error fixed, TWikibug:Item5263: remove preview on WYSIWYG edit, TWikibug:Item5116: added Opera to bad browsers filter
19 Nov 20 Dec 2007 TWikibug:Item4742 TWikibug:Item5047 : auto-disable if Wysiwyg is not enabled disable save and preview during page load TWikibug:Item4820 TWikibug:Item5111 : validate mandatory fields on save make the entry in the format menu sensitive to where the cursor is TWikibug:Item4747 TWikibug:Item5022 : made TT font size same as verbatim. Had to add a new style to do it, as TMCE didn't want to play with TT or CODE tags. TWikibug:Item4811: noautolink looks like an HTML construct but in fact is not; the tag is infact an "on-off" switch and does not imply any HTML structure, so cannot be converted to a DIV or a span, so has to be removed. TWikibug:Item4817: added typewriter text button TWikibug:Item4850: added font colour controls TWikibug:Item4645: added attachment management features TWikibug:Item4945: added switch to raw and back
16 Sep 19 Nov 2007 TWikibug:Item4630 TWikibug:Item4742 : polished up the auto-disable if Wysiwyg way the secret string is done, to not enabled ensure synch between perl and JS. TWikibug:Item4622 TWikibug:Item4820 : added UTF-8 handling steps that validate mandatory fields on save fixup malformed UTF8 strings before presenting them to the editor (saves Moz) and stops the editor passing them back to TWiki (saves IE). TWikibug:Item4603 TWikibug:Item4747 : added the add draft help, so we can at least build the beta without the nasty warning TWikibug:Item4811: noautolink looks like an HTML construct but in fact is not; the tag is infact an "on-off" switch and does not imply any HTML structure, so cannot be converted to a DIV or a span, so has to be removed. TWikibug:Item4817: added typewriter text button TWikibug:Item4850: added font colour controls TWikibug:Item4645: added attachment management features TWikibug:Item4945: added switch to raw and back
13 16 Sep 2007 TWikibug:Item4613 TWikibug:Item4630 fixed navigate-away prompt when unchanged : polished up the way the secret string is done, to ensure synch between perl and JS. TWikibug:Item4583 TWikibug:Item4622 : added UTF-8 handling steps that fixup malformed UTF8 strings before presenting them to the editor (saves Moz) and stops the editor passing them back to TWiki (saves IE). TWikibug:Item4604 TWikibug:Item4603 : added the draft help, so we can at least build the beta without the nasty warning TWikibug:Item4614 TWikibug:Item4616 A clutch of issues caused by use of the wrong encoding function when passing UTF8 parameters to REST using XMLHttpRequest.
12 13 Sep 2007 TWikibug:Item4604 TWikibug:Item4613 Converted to REST call for fixed navigate-away prompt when unchanged content conversion, to provide safe callback if JS is disabled in the browser TWikibug:Item4583relaxed regex to try and make it work for UTF-8 topic names TWikibug:Item4604 TWikibug:Item4614 TWikibug:Item4616 A clutch of issues caused by use of the wrong encoding function when passing UTF8 parameters to REST using XMLHttpRequest.
11 12 Sep 2007 TWikibug:Item4535 TWikibug:Item4604 refinements Converted to link handling REST call for content conversion, to improve topic name recognition provide safe callback if JS is disabled in the browser TWikibug:Item4583 relaxed regex to try and make it work for UTF-8 topic names
7 11 Sep 2007 TWikibug:Item4503 TWikibug:Item4535 excess empty lines refinements to link handling to improve topic name recognition TWikibug:Item4486 no toc headers with unofficial syntax TWikibug:Item4560: empty lines lost TWikibug:Item4566: corrupted table on save
6 7 Sep 2007 TWikibug:Item4557 TWikibug:Item4503 added missing files excess empty lines to package TWikibug:Item4486 no toc headers with unofficial syntax TWikibug:Item4560: empty lines lost TWikibug:Item4566: corrupted table on save
4 6 Sep 2007 TWikibug:Item4534 TWikibug:Item4557 added missing files to package TWikibug:Item4535 fixed
14679 4 Sep 2007 TWikibug:Item4481 TWikibug:Item4534 TWikibug:Item4524 TWikibug:Item4535 fixed
14668 14679 Bugfixes and refinements done as part of 4.2 release TWikibug:Item4481 TWikibug:Item4524 fixed
14543 14668 Added PROTECTED style, to allow protection Bugfixes and refinements done as part of special text. 4.2 release Disable on unsupported browsers (untested)
14538 14543 First release Added PROTECTED style, to allow protection of special text. Disable on unsupported browsers (untested)
Dependencies: 14538
NameVersionDescription
TWiki::Plugins::BehaviourContrib>=15357Javascript module
TWiki::Plugins::WysiwygPlugin>=16650Translator module
First release
Plugin Dependencies: Home: http://twiki.org/cgi-bin/view/Plugins/TinyMCEPlugin
NameVersionDescription
TWiki::Plugins::BehaviourContrib>=15357Javascript module
TWiki::Plugins::WysiwygPlugin>=16650Translator module
Feedback: Plugin Home: http://twiki.org/cgi-bin/view/Plugins/TinyMCEPluginDev http://twiki.org/cgi-bin/view/Plugins/TinyMCEPlugin
Appraisal: Feedback: http://twiki.org/cgi-bin/view/Plugins/TinyMCEPluginAppraisal http://twiki.org/cgi-bin/view/Plugins/TinyMCEPluginDev
Appraisal: http://twiki.org/cgi-bin/view/Plugins/TinyMCEPluginAppraisal

View topic | View difference side by side | History: r10 < r9 < r8 < r7 | More topic actions
 
This site is powered by the TWiki collaboration platformCopyright © 1999-2019 by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding TWiki? Send feedback
Note: Please contribute updates to this topic on TWiki.org at TWiki:TWiki.TinyMCEPlugin.