Check this out. Create a folder on your desktop called test. Drop a text file in called editor.html and make it look like this:
<html>
<head>
<title>TinyMCE Test</title>
<script language="javascript" type="text/javascript" src="tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
tinyMCE.init({
mode : "textareas",
theme : "advanced",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_buttons1 : "formatselect,fontselect,fontsizeselect,bold,italic,|,forecolor,backcolor,|,
justifyleft,justifycenter,justifyright,|,bullist,numlist,|,outdent,indent,
blockquote,|,link,image,hr,|,code,removeformat",
theme_advanced_buttons2: "",
theme_advanced_buttons3: ""
});
</script>
</head>
<body>
<!-- form sends content to moxiecode's demo page -->
<form method="post" action="http://tinymce.moxiecode.com/dump.php?example=true">
<textarea id="content" name="content" cols="50" rows="15">This is some content that will be editable with TinyMCE.</textarea>
<input type="submit" value="Save" />
</form>
</body>
</html>
Now download TinyMCE from http:///moxiecode.com. Unzip it such that you find the jscripts folder inside. Open that up and it contains "tiny_mce". Copy that "tiny_mce" folder into your "test" folder on your desktop. Now view editor.html in your web browser. Click Save. Watch it post to the moxiecode.com website. You could just as easily have posted that to your own PHP pages. Now open editor.html in any text editor. Note how few lines of code were used. The way I've got it set up is that it takes any textarea on the given page and converts it into a rich editor control.
Cool factor is high, right?
P.S. If you don't like the default font size, just edit the file in the path:
tiny_mce/themes/advanced/skins/default/content.css
Change the first line where it says 10px into 11 or 12px, or any font size you want.
No comments:
Post a Comment