History of TinymcePackage

Version 7

TinymcePackage

a description of how to use TinyMCE

Created by: laetzer, Last modification: 04 Feb 2009 (14:03 UTC) by laetzer

TinyMCE is a rich text editor. This means, that input areas for content look like an Office program. Users mark some text, then click on a button B or hit Ctrl+B on their keyboard, and instantly see the marked text bold. TinyMCE is XHTML compliant: once the users clicks safe, TinyMCE will markup the bold text with the XHTML tag strong. It is browser independent, written in Javascript, and released as Open Source under LGPL by Moxiecode Systems AB.

How to enable TinyMCE in Bitweaver

  1. Download the package and unpack it in your Bitweaver directory.
  2. Enable TinyMCE in Admin > Kernel > Packages.
  3. Enable HTML in Admin > Liberty > Plugins > Format. Consider setting HTML as default format.
  4. Enable the ability to input HTML for the user group of your choice in Admin > Users > Groups & Permissions.

Upgrade to a newer version of TinyMCE

You can upgrade TinyMCE - even if you don't upgrade bitweaver. Note that TinyMCE's language files are now to be downloaded seperately, if needed.
  1. download new version of TinyMCE and unzip into yourbitweaverdirectory/tinymce/jscripts (note that the directory structure differs slightly from the stucture found in the downloaded archive)
  2. download the TinyMCE compressor, unzip into yourbitweaverdirectory/tinymce/jscripts

Tips & tricks

plugins example: Fullscreen

Several native plugins are included. The plugin fullscreen can be useful if your pages have lots of text. The plugin adds a button to popup a full screen editor window. Open TinyMCE's ))header_inc.tpl((. Find the appropriate lines and add the fullscreen info where it belongs:

yourbitweaverdirectory/tinymce/templates/header_inc.tpl


<?php
original
plugins "table",
changetoplugins "table,fullscreen",

originaltheme_advanced_buttons3_add_before "tablecontrols,separator",
changetotheme_advanced_buttons3_add_before "tablecontrols,separator,fullscreen",
?>


Leave HTML code alone

By default, TinyMCE strips certain HTML tags or even attributes. This can be unwanted if you switch from WYSIWYG to HTML to do some quick adjustments. To prevent the striping, ad valid_elements : "**" in yourbitweaverdirectory/tinymce/templates/header_inc.tpl

Site's style for the edit area

It can be useful to make the editing area look just like your site. Gives an instant-preview impression. Yellow warning: things could get messy if, for instance, your body has a dark background color, and your content area is light. Tiny's editing area would get its background color from your site's body ... well, nothing that you couldn't override in your site's CSS. Advantage: you don't have to alter the CSS files found in /tinymce/jscripts/themes/ and thus keep your own styling informations in your own style folder. Less worry in case of a Tiny update. Work this line:

yourbitweaverdirectory/tinymce/templates/header_inc.tpl


<?php
original
content_css "{$smarty.const.THEMES_STYLE_URL}tinymce/tinymce.css",
changetocontent_css "{$smarty.const.THEMES_STYLE_URL}{$style}.css",
?>

Page History
Date/CommentUserIPVersion
26 Apr 2009 (08:54 UTC)
Lester Caine81.138.11.1368
Current • Source
laetzer141.20.150.437
View • Compare • Difference • Source
paul greavy83.199.246.2076
View • Compare • Difference • Source
laetzer85.178.27.2335
View • Compare • Difference • Source
laetzer85.178.27.2334
View • Compare • Difference • Source
laetzer85.178.56.2103
View • Compare • Difference • Source
xing194.152.164.452
View • Compare • Difference • Source