MooEditable: Editor HTML con Mootools

MooEditable es un editor de texto escrito en Mootools. Con esta librería podemos convertir nuestras cajas de texto o textareas en editores HTML con solo utilizar pocas líneas de código javascript.

Este editor es compatible con Internet Explorer 6/7/8, Firefox 2/3, Opera 9/10 y Safari 3/4, es ligero comparado con otras librerías como TinyMCE, se pueden personalizar los iconos y con una interfaz limpia.

mooeditable

Tiene las opciones básicas para formatear texto como: negrita, cursiva, subrayado, tachado, listas además soporte para incluir, imágenes, enlaces, archivos flash y finalmente se pueden incluir las acciones para deshacer y rehacer.

Como Utilizar MooEditable
Para su funcionamiento se requiere primero Mootools, entonces primero se debe incluir el archivo mootools.js y MooEditable.js, también es necesario incluir la hoja de estilos MooEditable.css el cual incluirá los estilos e imagenes necesarias para el funcionamiento de la librería.

  1. <link rel="stylesheet" href="css/MooEditable.css" />
  2. <script type="text/javascript" src="js/mootools.js"></script>
  3. <script type="text/javascript" src="js/MooEditable.js"></script>

El siguiente paso es crear nuestro formulario en el cual debemos insertar un tag textarea, es necesario aplicarle un estilo a este tag para definir el ancho el cual se utilizará para crear el editor.

  1. <textarea name="content" id="content" rows="10" style="width: 400px;"></textarea>

Finalmente asignamos el método mooEditable al elemento que contendrá el editor de texto. En nuestro caso se lo asignamos al elemento content que el textarea que hemos creado.

  1. window.addEvent('domready', function(){
  2.     $('content').mooEditable();
  3. })

Con lo cual obtenemos nuestro editor funcionando, pueden ver el resultado en mooeditable. Hay muchas opciones para personalizar al detalle este editor, para conocer mas acerca de las opciones pueden leer la documentación que viene en el archivo de descarga.

Comentarios Total 4 comentarios


Francisco
Publicado: 12/10/2009 11:43 am

Dependiendo de la web donde se haya de instalar puede ser bueno o malo. He tenido ciertos problemas con mootools en varios sitios por tener varios componentes o añadidos utilizando mootools.js.

Un saludo,

Algrox
Publicado: 26/10/2009 12:18 am

Me insteresa tu post pero….
Se puede abrir un archivo ? y como?

zeta
Publicado: 01/03/2010 11:14 am

da problemas cuando el usuario presiona enter

Crissomp
Publicado: 24/09/2010 5:35 pm

Gracias Man… estas herramientas simplican la vida de nosotros..

 

Comentar

En este blog los comentarios están moderados, serán mostrados cuando el administrador los apruebe. Por favor, evita comentarios ofensivos u obscenos por que no serán aprobados.
Si deseas publicar código fuente debes hacerlo entre las etiquedas <code> y </code>, además debes reemplazar los carácteres < por &lt; y > por &gt;.

(Requerido)

(Requerido, no será publicado)

(Requerido)

(Tags aceptados: <a> <em> <strong> <code> <ul> <li>)