septiembre 30, 2009 8

Probando CKEditor

By in JavaScript, Librerías

Hace no mucho hablamos en este blog de la nueva versión de FCKEditor, llamada ahora CKEditor. Hoy toca probar muy por encima, en otras entradas se verá con mayor profundidad, este editor WYSIWYG.

Lo primero que tenemos que hacer es incluir el script de CKEditor:

<script type="text/javascript" src="./ckeditor/ckeditor.js"></script>

Como se puede ver tenemos CKEditor dentro de una carpeta con el mismo nombre. Acto seguido, en alguna parte de la página, tendremos que tener un textarea de la siguiente forma:

<textarea name="editor">Esto es un ejemplo de CKEditor</textarea>

Ahora tenemos dos opciones, veamos la primera:

<script type="text/javascript">
CKEDITOR.replace('editor');
</script>

Si optamos por esta opción tendremos que poner el código en cualquier parte de la página, pero siempre después de la definición del textarea que será nuestro editor.
Si queremos colocar el código, que crea el editor, en el head de la página podemos optar por esta otra opción:

<script type="text/javascript">
window.onload = function()
{
    CKEDITOR.replace('editor');
}
</script>

Para que de esta forma se espere a que cargue la página para crear el editor. Podemos ver una demo en la siguiente página:

Demo de CKEditor.

Aquí termina este primer acercamiento a este, más que interesante, editor.

Comparte esta entrada:
Delicious Digg Google Technorati Menéame Fresqui Reddit Facebook Twitter Yahoo! Buzz MySpace Email BarraPunto

Tags: , , ,

8 Responses to “Probando CKEditor”

  1. EDUARDO dice:

    hola, estoy usando este control pero todavia no consigo la forma de elegir los botones que el usuario puede ver, tendras algun tutorial sobre esto? o vas a publicar alguno?

  2. En la documentación de CKEdit viene explicado como configurar la barra de herramientas:

    CKEditor 3.x > Developers Guide > Toolbar

    No lo he probado, así que no se muy bien como funciona. Entre hoy y mañana haré algunas pruebas y escribo algo al respecto.

  3. Roberto dice:

    Hola,Vi como habilitar las imagenes para hacer upload pero donde puedo configurar la ruta donde se guardaran? Eso no lo neocntre en la documentación. Si lo sabes te agradecere me ayudes.Gracias

  4. Pues no estoy muy seguro de donde se configuran las rutas, pero si miras en el archivo de configuración de CKFinder hay una pàrte donde se definen los tipos de recursos que vamos a tener:

    $config[‘ResourceType’];

    Esta variable es un array donde cada elemento es a su vez otro array. Dentro tiene un campo llamado ‘directory’. Puede que por ahí anden los tiros.

    Justo antes de definir los tipos de recursos hay una variable que se llama $config[‘DefaultResourceTypes’]. Por defecto tiene el valor ”, puede que eso pueda influir también.

  5. vito dice:

    Hola, quisiera saber como podría cambiar el texto dentro del editor, he probado con el id asignado al texta area pero no me hace el cambio.La idea es poder variar el contenido del editor en función de las opciones elegidas por el visitante.

  6. Edith dice:

    Hola. Gracias por estos tutoriales de ckeditor, bastante buenos y claros. Pero tengo una duda, ya lo estamos probando, pero el problema es que no funciona en alguan maquina con IE, y aparte de la version de IE, ¿que otra cosapudiera afectar?

  7. anto1389 dice:

    Hola! Gracias por este tutorial! Pero yo tengo un problema y es que yo hago lo mismo que tu explicas, de hecho lo hago por los dos metodos pero no hay forma de que el ckeditor me aparezca. Alguna idea de porque puede pasar? Muchisimas grcias!

  8. Pechuga dice:

    donde puedo configurar la ruta en el que se guardaran las imagenes, porfa ayuda urgente con esto se los agradeceria 

Leave a Reply