Installation&Using
Click here to see installation process for ASP version.
You must have possibility to run PHP scripts inside your files and rights to write to your directories at server!
- Copy directory 'class' on server. There must be access to this directory through an URL.
- Add code of the following form at the top of the file where you want RE to be used:
<?php $class_path = "path to 'class' directory"; require_once($class_path."class.rich.php"); ?>
Here, "path to 'class' directory" is string with path to directory 'class' where RE files is, e.g. "class/" if your script and this directory are in the same directory.
Alternative method
<?php $class_path = "path to 'class' folder relative to site root"; require_once($path_to_class_folder."class.rich.php"); ?>
Here "path to 'class' folder relative to site root" is a string with path to folder 'class' relative to site root, eg '/re/class/' for folder 'http://www.yourdomain.com/re/class/' $path_to_class_folder is a server side path to folder 'class' (could be set eg to $_SERVER['DOCUMENT_ROOT'].$class_path to be independent of where your script using RE is placed:
<?php $class_path = "/re/class/"; require_once($_SERVER['DOCUMENT_ROOT'].$class_path."class.rich.php"); ?>
In this case you do not need to change these settings even if you move the file using RE to another folder of your site
No global variables method
To avoid using of global variable $class_path it is possible to use function
$editor->set_class_path($class_path);
where $class_path is path to folder 'class'
Such approach is necessary when you have to create editor's instances inside your own functions where global variables are not seen. In case this function is not used to set path to folder 'class' the editor will use global variable $class_path
Note: variable $editor must be declared yet and function set_class_path must be called before methods get_rich() or draw()
- Insert following two strings inside tag <HEAD>:
<link rel="StyleSheet" type="text/css" href="<?php echo $class_path; ?>rich_files/rich<?php echo $rich_prefix; ?>.css"> <script language="JavaScript" src="<?php echo $class_path; ?>rich_files/rich<?php echo $rich_prefix; ?>.js"></script> <script language="JavaScript" src="<?php echo $re_class_path; ?>rich_files/rich_xhtml.js"></script>
Note: if you do not use XHTML mode the last <script> tag could be omitted
Also it is possible to insert this code using the following function:
echo rich_get_head_code($class_path);
where $class_path is path to folder 'class'
echo $editor->get_head_code();
Note: In this case variable $editor must be declared yet
- Code to create RE is of the form:
<?php $editor = new rich($caption, $name, $value, $width, $height, $files_path, $files_url, $page_mode, $absolute_path); $editor->draw(); // or echo $ed_4->get_rich(); ?>
Here $caption is string, appearing before RE in page (caption of editor), $name is name of the textarea element which is used to send editor's content through forms (must be unique if you create several editors), $value is string with initial content of the editor (can be empty), $width is width of the editor (can be in absolute values or in %s), $height is height of the editor (can be in absolute values or in %s), $files_path is string with path to top directory for remote and uploaded files relative to site root, eg '/files/upload/', $files_url is string with url to top directory (directory $files_path) for remote and uploaded files, $page_mode - set it to 'true' to edit the whole pages, otherwise can be omitted, $absolute_path - set it to true to refer to files at server through absolute paths (default), otherwise -- through relative (to site root) paths.
- Add 'save_in_textarea_all' function to onsubmit event handler, e.g:
<form action="" method="post" onsubmit="save_in_textarea_all();">
After the form submitted, content of the editor can be accessed in scripts via names set in variable $name.
RE appears on page in the place where method draw() is called.
Settings API
These functions use session technique, so sessions should be set correctly on your server. Cookies support in cliens' browsers are not required
Function list
- set_avail_paths($paths); //set paths available for uploading, renaming, etc
Example: $editor->set_avail_paths(array('/files/uploaded/', '/files/shared/'));
- set_total_size($size); //max available size (in bytes) of files uploaded
Example: $editor->set_total_size(1024*1024);
- set_can_upload($can_upload); //enable or disable uploading
If $can_upload is set to true then uploading will be enabled. Otherwise disabled
- set_max_size($max_size); //set max size (in bytes) of file available for uploading
Example: $editor->set_max_size(1024);
- set_allow_override($allow_override); //set permissions to override existing files
Set $allow_override to true to allow overriding, otherwise set it to false
- set_avail_files($files); //set file extensions available for uploading and renaming
Example: $editor->set_avail_files(array ('zip', 'txt'));
- set_not_avail_files($files); //set file extensions not available for uploading and renaming
Example: $editor->set_not_avail_files(array ('php', 'pl'));
- set_avail_images($images); //set image types available for uploading and renaming
Example: $editor->set_avail_files(array ('gif', 'png'));
- set_not_avail_images($images); //set image types available for uploading and renaming
Example: $editor->set_not_avail_images(array ('jpg'));
- set_max_image_size($width, $height); //set max size of images available for uploading
Example: $editor->set_max_image_size(1024, 768);
- set_max_image_flash($width, $height); //set max size of flash files available for uploading
Example: $editor->set_max_flash_size(1024, 768);
- set_can_create_dir($can_create); //set permissions to create folders
Action available if $can_create set to true. Otherwise disabled
- set_can_rename_dir($can_rename); //set permissions to rename folders
Action available if $can_rename set to true. Otherwise disabled
- set_can_delete_dir($can_delete); //set permissions to delete folders
Action available if $can_delete set to true. Otherwise disabled
- set_can_rename_file($can_rename); //set permissions to rename files
Action available if $can_rename set to true. Otherwise disabled
- set_can_delete_file($can_delete); //set permissions to delete files
Action available if $can_delete set to true. Otherwise disabled
- set_default_settings(); //erase all settings stored in session varibles (return to default settings)
To change settings to its default values defined in check_auth.inc.php call the appropriate functions without arquments, eg. $editor->set_allow_override();
Simple mode
To handle RE Simple mode add a sring of the form
$editor->simple_mode($mode);
before draw() method call.
If $mode is true or omitted, the simple mode is on, otherwise -- off.
Customization
To hide some buttons use the method
$editor->hide_tb($item, $mode);
before draw() method call.
Here
$item is a string defining a button (or a group of buttons) to be hidden/shown,
$mode -- set it to true to hide buttons, defined by $item, or can be ommited, if set to false the $item buttons are shown at RE toolbar.
Using the hide_tb() function it is possible to hide some buttons of RE toolbar. Besides it, you can set up your own "simple mode" adding or deleting the function calls inside simple_mode() function.
The possible values of $item:
'fullscreen' -- fullscreen mode button;
'preview' -- preview button;
'find' -- find&replace button;
'clipboard' -- cut, copy and paste buttons; 'history' -- undo and redo buttons;
'text' -- bold, italic, underline, strikesrough, superscript and subscript buttons;
'align' -- align left, center, right and justify buttons;
'list' -- ordered and unordered list buttons;
'indent' -- indent and outdent buttons;
'hr' -- horizontal line buttons;
'remove_format' -- remove formatting button;
'table' -- create table, insert/delete row, insert/delete column buttons;
'adv_table' -- insert/delete cell, merge cells, split cell buttons (shown only if 'table' buttons are not hidden);
'paragraph' -- paragraph select;
'font' -- font select;
'style' -- stylesheet class select;
'size', -- font size select;
'color',-- forecolor and backcolor buttons;
'image' -- insert image button;
'flash' -- insert flash button;
'video' -- insert video button;
'link' -- create hyperlink button;
'paste_word' -- paste text from MS Word button;
'switch_borders' -- show invisible table borders button;
'special_chars' -- insert special char button;
'form' -- form elements' buttons;
'snippets' -- insert custom html code button;
'absolute_position' -- absolute positioning button;
'anchor' -- create anchor button;
'page_properties' -- page properties button; 'help' -- help button.
Active mode
To handle RE Active mode add a sring of the form
$editor->active_mode($mode);
before draw() method call.
If $mode is true or omitted the active mode is on, otherwise -- off.
XHTML mode
In XHTML mode editor generates source code in XHTML 1.0 format instead of common HTML. To handle RE XHTML mode add a sring of the form
$editor->xhtml_mode($mode);
before draw() method call.
If $mode is true or omitted the xhtml mode is on, otherwise -- off.
To change document language/charset settings use the following functions:
//set document language $editor->set_doc_lang($lang); //set document charset $editor->set_doc_charset($cs);
Here $lang is a string specifying language of the document (' en' -- default), $cs is charset of the document (' iso-8859-1' -- default)
Note: if the language/charset settings are not spesified, the current language of RE toolbar and charset of the corresponding language file is used
$editor->xhtml_mode($mode);
before draw() method call.
If $mode is true or omitted the xhtml mode is on, otherwise -- off.
To change document language/charset settings use the following functions:
//set document language $editor->set_doc_lang($lang); //set document charset $editor->set_doc_charset($cs);
Here $lang is a string specifying language of the document ('en' -- default), $cs is charset of the document ('iso-8859-1' -- default)
Note: if the language/charset settings are not spesified, the current language of RE toolbar and charset of the corresponding language file is used
To set default stylesheet files use the following function:
$editor->set_default_stylesheet($style_path);
before draw() method call.
Here $style_path is a path to stylesheet file (or array of such paths) from the folder where script creating the editor is
Snippets
To define html snippets to be used in the editor use the following function:
$editor->set_snippets($snippets, $group);
before draw() method call.
Here $snippets is an array (or array of such arrays) of the form
array('name' => 'name of the snippet', 'code' => 'code of the snippet')
$group is name of a snippet group that these snippets should to be placed in (could be omitted)
HTML tags are available inside html snippets
Language
To set the desired language use the following function:
$editor->set_lang($lang);
before draw() method call
Here $lang is code of the language
Supported languages (language codes):
- Dutch (nl)
- English (en) -- default
- French (fr)
- Hungarian (hu)
- Japanese (ja)
- German (de)
- Russian (ru)
- Turkish (tr)
$editor->active_mode($mode);
before draw() method call.
If $mode is true or omitted the active mode is on, otherwise -- off.
To make borders visible by default call the function:
$editor->set_borders_visibility($set_on);
before draw() method call
Here $set_on should be set to true or omitted to make borders visible by default
By default <br> tag is inserted on Enter Key press. To insert <p> tag use Shift-Enter instead.
To change this behaviour call function:
$editor->set_br_on_enter($set_on);
before draw() method call
Here $set_on should be set to true or omitted to make RE handle Enter Key press as described above; otherwise Enter Key press inserts <p> tag and Shift-Enter inserts <br>
To specify your own list of fonts and font sizes use the following functions:
$editor->set_font_list($font_data); $editor->set_font_size_list($font_data);
before draw() method call
Here $font_data is name of font/font size (or array of such values)
Save button
To use a toolbar button to submit form with Rich Editor instead of clicking on form submit button the following code should be used:
//make the button visible $editor->hide_tb('save', false); //define reaction on the button click $editor->set_on_save_handler($code);
before draw() method call
Here $code is code to be performed on the button click E.g. to submit form with id "form_id" set $code to string 'document.getElementById("form_id").submit()'
Note: If you use the save button to submit form data, it is not necessary to add function save_in_textarea_all() to onsubmit form attribute
To make RE to use "Paste from Word" function instead of common Paste to clean all html code pasted the following function should be used:
$editor->set_clean_paste($set_on);
before draw() method call
Here $set_on should be set to true or omitted to make RE to clean all the code pasted
Often it is necessary to protect some parts of content being modifed. Eg we would like to show the whole html page to users but let them to modify some parts of it only so that page layout stays intact.
To define edtiable regions special tags compatable with Dreamweaver could be used:
<!-- #BeginEditable "comment here" --> This content <strong>could be</strong> modified! <!-- #EndEditable -->
There could be unlimited number of such regions. The tags themselves mustn't be modified except comments inside double quotes. There should not be opening/closing tags inside an editable region that have closing/opening tags outside it. So, the editable tags mustn't overlap with other thml or editable tags.
To make RE using Editable regions mode the following function could be used:
$editor->set_editable_regions($set_on);
before draw() method call
Here $set_on should be set to true or omitted to set Editable regions mode on
Note: The mode is supported in IE 5.5+, otherwise content loaded in RE is shown, but could not be modified by users
Javascript API
To get content of a editor from javascript use the following function:
var editor_content = get_rich(editor_name);
Here editor_name is name of the desired editor. Eg. for first instance of the editor at the demo page this variable should be set to string 'rich_one'. Javascript variable editor_content will be set to the content of the editor instance named 'rich_name'
To set new content to a editor from javascript use the following function:
var result = set_rich(editor_name, content);
Here editor_name is name of the desired editor. Eg. for first instance of the editor at the demo page this variable should be set to string 'rich_one', content is a variable specifying content to be set. Javascript variable result is set to true if content was changed successfully and to false otherwise
|