This tutorial provides developers with the basic knowledge required to instantiate EditLive! in a web page.
The following skills are required prior to working with this tutorial:
Step 1. Create a HTML page
Create a basic webpage with the following content:
Save this webpage as instantiation.html
Step 2. Reference the editlivejava.js
EditLive! comes packaged with a directory called redistributables. This directory contains the core files required to instantiate EditLive! in a webpage.
Specify the editlivejava.js file in your instantiation.html webpage.
For example, if your instantiation.html file was in the same directory as the redistributables directory packaged with EditLive!, you would specify the following line of code:
Step 3. Define the editor name and size.
- Name - the unique name for this particular instance of EditLive!. In the context of this tutorial, this value is arbitrary.
- Width - a number specifying the width of the EditLive! instance, in pixels
- Height - a number specifying the height of the EditLive! instance, in pixels
Step 4. Specifying the EditLive! Configuration File
In order to customize and configure various elements of the editor, developers need to create and specify an EditLive! Configuration File. EditLive! Configuration Files are covered in detail in the both the Reference and Developer Guide sections of this SDK. The Creating and Editing Configuration Files tutorial describes in detail how to make and edit EditLive! Configuration Files. For the purposes of this tutorial, the example below uses the default configuration file (sample_eljconfig.xml) packaged with EditLive! and stored in the redistributables directory. To specify a Configuration File, the setConfigurationFile Method is used.
Step 6. Displaying EditLive!
The show Method of EditLive! is used to to render the applet on the page.
Get the full code at Instantiation Tutorial Code.