Extension:FCKeditor (by Mafs)

From MediaWiki.org

Jump to: navigation, search
Manual on MediaWiki Extensions
List of MediaWiki Extensions
FCKeditor extension

Release status: experimental
Implementation Page action
Description using the FCKeditor for editing wiki pages
Last Version fck/mw-extension (0.7.4) 2007 (07-02-2007)
MediaWiki 1.10.x+
License No license specified
Download Extension page

Contents

[edit] Introduction

This is an experimental approach providing a semi WYSIWYG editor concept.

  • It may lead to security and technical problems as well as data corruption.
  • It should work reasonably within a controlled environment.
  • For background information have a look at the WYSIWYG editor article, in which advantages and disadvantages of such tools in the framework of Wikis are studied thoroughly.

[edit] Usage

Depending on your configuration the editor is either activated on a per page basis for those pages having the token __USE_EDITOR__ on it (see Screen shots) or it is activated globally (see below).

[edit] Wysiwyg

  • Use the FCKeditor for full WYSIWYG text (eg font and background colors), table and image image:FCKImage4.png formatting.
  • A heading is created by selecting/highlighting an expression and then clicking on "Format" -> "Heading[1-5]". A TOC and edit section links are displayed according to the normal rules.

[edit] Wiki syntax

Wiki syntax has to be used for:

  • internal wiki links: [[PageTitle]];
  • external links: [http://www.mediawiki.org];
  • category links and
  • images links [[Image:ImageTitle.png]] and
  • extensions like <math> ... </math> or private extensions <your_extension> ... </your_extension>;
  • mediawiki magic words, eg __TOC__;
  • templates.


  • images links [[Image:ImageTitle.png]] can still be used.

[edit] Activating the editor on a per page basis

  1. open a new page for editing;
  2. add the token " __USE_EDITOR__ ";
  3. save the page;
  4. click again on "edit" and you should see the FCKeditor.
  • For deactivating the editor remove the token in edit mode.
  • For escaping the magic word "__USE_EDITOR__" see [1].
  • Do not add the token "__USE_EDITOR__" on an existing page which contains standard wiki syntax. The fckeditor removes line breaks which corrupts your page layout. (But don't panic, the history function is always available.)

[edit] Changelog

  • update: mediawiki version 1.6.2, fckeditor version 2.2 Mafs 20:15, 10 April 2006 (UTC)
  • patch free, true extension version published Mafs 09:48, 14 May 2006 (UTC)
    • small fix in FCKeditor.php Mafs 16:17, 15 May 2006 (UTC)
    • documentation rewritten Mafs 19:51, 3 July 2006 (UTC)
    • support for extensions (like <math>) improved. Mafs 20:25, 7 July 2006 (UTC)
    • tested on mediawiki 1.7.1 Mafs 16:22, 11 July 2006 (UTC)
    • FCKeditor image dialog image:FCKImage4.png adapted for inserting and formatting images based on mediawiki images names. Using some ajax code the image dialog shows a suggest list when typing an image search term, see screen shots. Mafs 16:13, 16 July 2006 (UTC)
    • some code improvements ... Mafs 20:25, 17 July 2006 (UTC)
    • new version of FCKeditor.php: case insensitive search, "return true" added to hook functions Mafs 17:15, 28 July 2006 (UTC)
    • removed $wgAjaxExportList = array( 'wfSajaxSearch' ); from the LocalSettings.php section. Mafs 21:41, 1 August 2006 (UTC)
    • function wfFCKeditorBypassParserPaste rearranged to fix __TOC__ problem. Mafs 20:46, 3 August 2006 (UTC)
    • The pages containing the code have been reverted (see history) Mafs 16:36, 30 August 2006 (UTC)

[edit] Restrictions, bugs

  • The text is stored as HTML in the database.
  • Removal of unwanted, hidden text properties can be a hard job in some cases.
  • Using Netscape 7.1 browser, you cannot use the "browser page-back" navigation function beyond a page, where the WYSIWYG editor was invoked for page editing.
  • Paste function (pasting clipboard content) seems to be prohibited - at least when using Netscape 7.1 browser.
  • "Show preview" function does not work properly.
  • Templates will work if they do only contain wiki syntax.
  • Special pages cannot be included.

[edit] Integration of the FCKeditor into mediawiki software

[edit] Tested on

  • Mediawiki version: 1.7.1
  • FCKeditor version: 2.3
  • Browser:
    • Firefox 1.5.0.4
    • IE
    • Firefox 2.0

[edit] Quick overview

  1. Install FCKeditor
  2. Put FCKeditor.php in extensions directory
  3. Adapt LocalSettings.php
  4. Adapt fckconfig.js (set FCKConfig.mwScriptPath)
  5. Replace fck_image.js
  6. Replace fck_image.html

[edit] Installing FCKeditor

  1. Get the FCKeditor from http://www.fckeditor.net
  2. Put the package into the subdirectory /FCKeditor of your mediawiki installation.
  3. Replace the content of the file /FCKeditor/editor/dialog/fck_image.html by the content of this page /fck_image_html. Please follow the "Copy-How-To" on top of the page.
  4. Replace the content of the file /FCKeditor/editor/dialog/fck_image/fck_image.js by the content of this page /fck_image_js.
  5. Add this section at the end of the file /FCKeditor/fckconfig.js:
// ******************************************************************************************
 
// section modified image dialog
 
FCKConfig.LinkDlgHideTarget	= true ;
FCKConfig.LinkDlgHideAdvanced	= true ;
FCKConfig.ImageDlgHideLink	= true ;
FCKConfig.ImageDlgHideAdvanced	= true ;
FCKConfig.FlashDlgHideAdvanced	= true ;
 
FCKConfig.LinkBrowser 	= false ;
FCKConfig.ImageBrowser 	= false ;
FCKConfig.FlashBrowser 	= false ;
FCKConfig.LinkUpload 	= false ;
FCKConfig.ImageUpload 	= false ;
FCKConfig.FlashUpload 	= false ;
 
FCKConfig.mwScriptPath = "";     // When using the modified image dialog
				 // you must set this variable. It must correspond to 
				 // $wgScriptPath in LocalSettings.php.
 
// end section modified image dialog
 
FCKConfig.ToolbarSets["Wiki"] = [
	['Source','-','Save','NewPage','-'],
	['Cut','Copy','Paste','PasteText','PasteWord','-','Print'],
	['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
	['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
	['OrderedList','UnorderedList','-','Outdent','Indent'],
	['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
	['Link','Unlink','Anchor'],
	['Image','Table','Rule','Smiley','SpecialChar','PageBreak','UniversalKey'],
	['Style','FontFormat','FontName','FontSize'],
	['TextColor','BGColor'],
	['FitWindow','-','About']
] ;
You must explicitly specify FCKConfig.mwScriptPath which must correspond to $wgScriptPath in LocalSettings.php.
(The FCKeditor has its own built in file and upload browser which can be used as an alternative to the mediawiki upload function. If you want to use it do not replace the files fck_image.html and fck_image.js and do not add the "section modified image dialog" in fckconfig.js. For enabling the FCKeditor's built in file browser and upload function see FCKeditor Developer's Guide at the bottom of the page. Note that you completely bypass all security checks of the mediawiki software for uploaded files when using this feature.)


Finally check your FCKeditor installation:

  1. browse to www.yourserver.org/yourwikidir/FCKeditor/_samples/default.html.
  2. You should see something like:

Should you encounter troubles, consult the FCKeditor help pages.

[edit] Extension FCKeditor.php

Put the extension code which can be found on this page /extension as FCKeditor.php into the extensions directory of your mediawiki installation. Please follow the "Copy-How-To" on top of the page.

[edit] LocalSettings.php

Add these lines at the end of file LocalSettings.php (before the final ?>).

/* Installing this extension may lead to security and technical problems 
 * as well as data corruption.
 */
require_once("extensions/FCKeditor.php");
 
$wgFCKUseEditor          = false;      // When set to 'true' the FCKeditor is the default editor.
$wgFCKEditorDir          = "FCKeditor";
$wgFCKEditorToken        = "__USE_EDITOR__";  
$wgFCKEditorToolbarSet   = "Wiki";
$wgFCKEditorHeight       = "600";
$wgFCKEditorAllow_a_tags      = true; // <a> </a>   : Set this to true if you want to use the **external** link 
                                       // generator of the FCKeditor.
$wgFCKEditorAllow_img_tags    = true; // <img />    : Set this to true if you want to use the 
                                       // file browser and/or the smilies of the FCKeditor.
$wgFCKexcludedNamespaces = array(8,1,-1);    // eg. "8" for disabling the editor within the MediaWiki namespace.
 
/**
 * Enable use of AJAX features.
 */
$wgUseAjax = true;
$wgAjaxExportList[] = 'wfSajaxSearchImageFCKeditor';


Read the security warnings:
By default FCKeditor is set to 'false' as a default editor.
To make FCKeditor the default editor change 'false' to true to look like this in your LocalSettings.php file:
$wgFCKUseEditor = true; // When set to 'true' the FCKeditor is the default editor

[edit] Screen shots

[edit] Text editing

normal view
edit view

[edit] Image inserting and formatting image:FCKImage4.png

normal view
edit view
image dialog with suggest list

[edit] Related links

[edit] Wikimania 2006

[edit] Tutorials and Hints

[edit] Demonstrations-Wikis

[edit] Related WYSIWYG-Projects and FCK-Mods

[edit] Unsorted

Retrieved from "http://www.mediawiki.org/wiki/Extension:FCKeditor_(by_Mafs)"
Personal tools