Required elements
URL of script
Xinha needs the variable _editor_url to be activated.
you may try a relative URL if you wish, but it's highly recommended to use an absolute URL.
Xinha require the trailing slash.
The variable here is set to /xinha/
Language
Xinha support localized languages. It is only needing to set the variable _editor_lang to the wanted language. Set here to "en". This language can not be updated once Xinha script is loaded.
Include main script
It is of course needed to include the main script. Which could actually looks like the following code.
<script type="text/javascript"> _editor_url = "/xinha/"; _editor_lang = "en"; </script> <script type="text/javascript" src="/xinha/XinhaCore.js"></script>
Form preparation
The TEXTAREA that's need to be turned into a Xinha editor, absoluty require an ID, uniq ID obviously.
<form> <textarea id="description"></texarea> <form>
Editor preparation
Generic variable creation
Because it is usually required to manipulate Xinha by javascript, it is needed to create a variable to hold the object created.
Init function
It is needed to make a function to start the editor that we will trigger once the document is loaded. In this function, we will do basic initialisation such as creation of the configuration object and editor start.
Xinha start
Once the document is loaded, the init function must be triggered. There is quite a lot of methods to do it, the two easiest for our first example here are :
<body onload="initXinha();">
or the method we will use here
window.onload = initXinha;
Which finally give the following result.
<script type="text/javascript"> var editeur = null; function initXinha() { var config = new Xinha.Config(); editeur = Xinha.makeEditors(['description'], config); Xinha.startEditors(editeur); } window.onload = initXinha; </script>
Complete source code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>Sample</title> <script type="text/javascript"> _editor_url = "/xinha/"; _editor_lang = "en"; </script> <script type="text/javascript" src="/xinha/XinhaCore.js"></script> <script type="text/javascript"> var editeur = null; function initXinha() { var config = new Xinha.Config(); editeur = Xinha.makeEditors(['description'], config); Xinha.startEditors(editeur); } window.onload = initXinha; </script> </head> <body> <form> <textarea id="description"></textarea> <form> </body> </html>
