This article briefly takes you through how to rapidly integrate EditLive! into your application. A textarea in a page is replaced with EditLive! (source for the starting page available as attached (simple_formhtml.txt) — right click and save as in IE to view the source). The name of the text field we are replacing in this example is "web_content". The form in the page submits to a basic debugging page (source available as attached (debugphp.txt)). To skip straight to the ending, you can see the resulting html as attached (simple_form_with_edit_livehtml.txt). To see the simple four steps, start now.
Step 1) Register and Download the EditLive! (http://editlive.com/releases).
Step 2) Copy the editlivejava redistributables to your server to a folder called editlivejava (if you downloaded the zip package you will find this in editliveforjava/webfolder/redistributables/editlivejava)
Step 4) Create a script block to create and setup an instance of EditLive!, a simple construction would consist of:
- create an instance of edit live called web_content with a height of 600 and a width of 550 pixels:
var editliveInstance = new EditLiveJava("web_content", 600, 550);
- set the content for the editor (encoding it so any html will carry across happily):
editliveInstance.setBody(encodeURIComponent("text for the content"));
- set the configuration file. You can omit this if you just want to use the default.
- display the applet
This will produce a simple integration of the EditLive! editor into your web page. The contents of the body will be available in the field web_content. It is then possible to update the configuration file to take advantage of the large number of customisation options available.