Integrate FCKEditor in Dokuwiki

Dokuwiki is a nice wiki application, easy to setup, and with a lot of plugins (notes, LaTeX rendering …). It features a tiny javascript editor in order to publish pages without knowledge of its wiki syntax. Yet, some users would certainly like a more advanced WYSIWYG editor, especially for handling images upload and positioning.

So, here’s a quick tutorial to embed FCKeditor[1], a GPL-ed WYSIWYG XHTML-compliant editor, in Dokuwiki[2].

First, setup FCK as the default DokuWiki editor:

 ptln('<script type="text/javascript" charset="utf-8" src="'.       DOKU_BASE.'lib/scripts/FCKeditor/fckeditor.js"></script>',$it);  ptln('<script type="text/javascript" charset="utf-8">window.onload = function() '.       '{ var fck = new FCKeditor("wiki__text", "100%", "600"); fck.BasePath = "'.       DOKU_BASE.'lib/scripts/FCKeditor/"; fck.ReplaceTextarea(); }</script>');

where “100%” and “600″ are the editor width and height;

 <div id="size__ctl"></div>
 alert( 'Error: The TEXTAREA with id or name set to "' + this.InstanceName    + '" was not found' ) ;

Then, we need to tell DokuWiki that pages are now written in HTML, and not using its wiki syntax:

 io_saveFile($file, $text);

by

 io_saveFile($file, "<html>$text</html>");

so that it will save content between <html> tags, telling Dokuwiki we’re embedding HTML;

   p_render('xhtml',p_get_instructions($txt),$info)

by

   p_render('xhtml',p_get_instructions("<html>$txt</html>"),$info)

so that the preview text will be also interpreted as HTML.

One of the bast feature of FCK is its images/files upload management. If you want to enable it:

That’s all, you’ve got FCKeditor running in your wiki.

At least, if want to get an easy way to create internal links (and so, new pages), you should add a rewrite rule to make your wiki interpret links like foo as index.php?id=foo. Using it, you’ll be able to create new pages using the FCK link editor, by adding a link with no protocol and just a page name.

Notes

[1] I first choosed TinyMCE, until I discovered its images management plugin wasn’t free, while FCK’s one is.

[2] Using with DokuWiki v2006-03-09 and FCKeditor v2.3.

[3] $BASE is supposed to be the DokuWiki install path on your server.

Comments

11 Responses to “Integrate FCKEditor in Dokuwiki”

  1. Alex on July 17th, 2006 4:27 pm

    Oups, I removed your comment while deleting spam …

    So, the question was how did I convert the site.

    Actually, I make this on a fresh Dokuwiki install, so I didn’t convert anything. If you want to do so, I think you’ll avec to convert all pages from Wiki format to HTML, and then add &lt;html&gt; tags in the file.

  2. Peter on August 18th, 2006 2:38 pm

    Nice post, any known bugs with this approach? Would you have a demo available?

    Thanks

  3. Alex on August 25th, 2006 1:15 am

    Hi Peter. I didn’t notice any bugs at the moment, and it works fine to manage images. Yet, I don’t have any demo for this. But tell me if you need to setup one and have some difficulties.

    Cheers

  4. seyool on August 28th, 2006 6:07 pm

    Nice TIP but, can i use <code> tag or other syntax tag?

  5. Manfred on September 15th, 2006 11:33 pm

    Hi, thank you for your tutorial. The FCKEditor works very fine in my dokuwiki. But there is one problem: After setup the FCKEditor the TOC doesn’t appear on my pages. What can I do?

  6. justin on September 20th, 2006 10:53 pm

    In $BASE/inc/html.php delete/comment the following line (l.1023), to remove the original JS editor:

    i dont see this line? am i blind, mine goes to line 946.. i have the latest version

  7. Allan on November 20th, 2006 1:50 pm

    Any changes inherent to the latest version of DocuWiki? (11/06)

  8. Alex on November 21st, 2006 5:22 pm

    I don’t know, as I didn’t upgrade my DokuWiki install that uses this hack.

    But if you find something different, you could create a page on Dokuwiki and paste a link here so that people know what’s need to be changed, thanks.

  9. Thierry on May 9th, 2007 1:43 am

    Hi, Thanks for your help, but the editor is not running with my Dokuwiki.
    Do you have idea ?

  10. AnhNguyen on September 19th, 2007 12:16 pm

    Not work with dokuwiki-rc2007-05-24

  11. Alex on September 23rd, 2007 6:04 pm

    Hi,

    Sorry but I won’t have to upgrade it, I don’t have projects using dokuwiki currently.
    Yet, if one of you can make it, you’re welcome to create a page on the documentation wiki of dokuwiki, with installation details.

Leave a Reply

You must be logged in to post a comment.