Tinymce and Domino Integration

Source: Internet
Author: User

Tinymce and Domino Integration
I. Introduction to tinymce
Tinymce is a lightweight browser-based WYSIWYG editor written in JavaScript. It has excellent support for IE6 + and firefox1.5 +. It can meet the needs of most websites, and its function configuration is flexible and simple. Another feature is that the loading speed is very fast and can be customized freely. tinymce is a free software released based on lgpl license, which you can use for commercial applications.

2. Integration with Domino
1. decompress the following file and put the tiny_mce file under the server directory, for example (webhtml \ JS \ tiny_mce)
Http://tinymce.moxiecode.com download
2. Create a sub-form in the system you want to use. The HTML content embedded in the sub-form is as follows (the red mark must be changed based on the server)
<HTML>
<Head>
<Title> tinymce and Domino integration </title>
<! -- Tinymce -->
<Script language = "JavaScript" type = "text/JavaScript" src = "/webhtml/JS/tiny_mce/tiny_mce.js" temp_src = "/webhtml/JS/tiny_mce/tiny_mce.js"> </SCRIPT>
<Script language = "JavaScript" type = "text/JavaScript">
Tinymce. INIT ({
Mode: "textareas ",
Theme: "advanced ",
Elements: "elm1 ",

Plugins: "table, save, advhr, advimage, advlink, iespell, insertdatetime, preview, zoom, Flash, searchreplace, print, contextmenu, paste, directionality, fullscreen, noneditable,-emotions, fullpage ",
Theme_advanced_buttons1_add_before: "Save, newdocument, separator ",
Theme_advanced_buttons1_add: "fontselect, fontsizeselect ",
Theme_advanced_buttons2_add: "separator, insertdate, inserttime, preview, separator, forecolor, backcolor ",
Theme_advanced_buttons2_add_before: "Cut, copy, paste, pastetext, pasteword, separator, search, replace, separator ",
Theme_advanced_buttons3_add_before: "tablecontrols, separator ",
Theme_advanced_buttons3_add: "emotions, iespell, Flash, advhr, separator, print, separator, LTr, RTL, separator, fullscreen, fullpage ",
Theme_advanced_toolbar_location: "TOP ",
Theme_advanced_toolbar_align: "Left ",
Theme_advanced_path_location: "bottom ",
Content_css: "example_full.css ",
Plugin_insertdate_dateformat: "% Y-% m-% d ",
Plugin_insertdate_timeformat: "% H: % m: % s ",
Extended_valid_elements: "HR [class | width | size | noshade], font [face | size | color | style], span [class | align | style]",
External_link_list_url: "example_link_list.js ",
External_image_list_url: "example_image_list.js ",
Flash_external_list_url: "example_flash_list.js ",

File_browser_callback: "filebrowsercallback ",
Theme_advanced_resize_horizontal: false,
Theme_advanced_resizing: True,
Apply_source_formatting: True
});

Function filebrowsercallback (field_name, URL, type, Win)
{
// This is where you insert your custom filebrowser Logic
VaR o=win.doc ument. getelementbyid ("filedia ");
O. Click ();
Win.doc ument. getelementbyid (field_name). value = O. value;
}
</SCRIPT>
<Script language = "JavaScript" type = "text/JavaScript" src = "/webhtml/JS/tiny_mce/plugins/emotions/editor_plugin.js" temp_src = "/webhtml/JS/tiny_mce/ plugins/emotions/editor_plugin.js "> </SCRIPT>
<Script language = "JavaScript" type = "text/JavaScript"> tinymce. setpluginbaseurl ('emotions', '/webhtml/JS/tiny_mce/plugins/emotions'); </SCRIPT>
</Head>
<Body topmargin = "0">
[<RTF field (customize the style in the field HTML Tag, for example, height: 100%; width: 100% ;)
</Body>
</Html>
3. Insert the child form to the form in the editor.
Iii. Description
1. The tool buttons of the editor can be customized as needed.
2. Here we only use the simplest method, using the RTF domain. here we can use other flexible methods.
3. <: this can be interpreted as HTML before the RTF domain (without the HTML output on the page Code

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.