FCKeditor (I Parte): Su Instalación
Luego de conocer los mejores editores wysiwyg on line vamos a tratar la instalación del FCKeditor en un formulario web, no sólo de un CMS, pués para estos ya existen los módulos (casos de mambo, drupal o phpnuke) o plugins (caso de wordpress, simpleCMS, etc, etc.). El proceso que vamos a ver es muy simple, pues el mismo script así lo ha previsto.
![]()
FCKeditor se puede instalar bajo cualquier lenguaje del servidor (PHP, ASP, JSP, ColdFusion) o en todo caso bajo JavaScript. Ahora vamos a ver los dos tipos de instalación más usados.
Instalación con Javascript
Luego de descargar el editor, procedemos realizar lo siguiente:
1er paso
Creamos una carpeta bajo el nombre de FCKeditor (o el de tu gusto) donde colocaremos el codigo que viene en la carpeta editor (cuando lo descarguemos), con esto hecho procedemos a llamar al JavaScript, dentro de las etiquetas head colocamos:
<script type="text/javascript" src="/FCKeditor/fckeditor.js"></script>
2do paso
Ahora lo único que falta es crear el formulario
Método 1
Un primer metodo es ubicarnos dentro de la etiqueta body, en el lugar donde queremos que vaya el formulario y colocar lo siguiente:
<script type="text/javascript">
var oFCKeditor = new FCKeditor( 'FCKeditor1' ) ;
oFCKeditor.Create() ;
</script>
Método 2
El otro método consiste en reemplazar el Textarea de tu formulario ya existente, para esto debe tener un name o un id que lo individualice. El script quedaría de la siguiente forma:
<html>
<head>
<script type="text/javascript" src="/FCKeditor/fckeditor.js"></script>
<script type="text/javascript">
window.onload = function()
{
var oFCKeditor = new FCKeditor( 'MyTextarea' ) ;
oFCKeditor.ReplaceTextarea() ;
}
</script>
</head>
<body>
<textarea id="MyTextarea" name="MyTextarea">Este es <strong>el valor </strong> inicial</textarea>
</body>
</html>
3er paso
Finalmente lo probamos en el navegador y listo.
Instalación con PHP
A pesar de ser muy sencilla la instalación, cuando uno necesita aplicar el editor a dos textareas de una misma pagina, el javascript resulta complicado, pues habría que hacerle algunas modificaciones. Por lo que resulta mas práctico hacer la instalación con PHP.
1er Paso
De la misma manera que en el caso anterior, lo primero es hacer una llamada, en este caso, al archivo fckeditor.php, mediante un include() o un require_once() dentro de las etiquetas head del HTML.
El código es el siguiente:
include("FCKeditor/fckeditor.php") ;
?>
2do Paso
Estando integrados con la clase PHP del FCKeditor, ahora vamos crear las textareas, cuantas queramos en una misma pagina o en varias. Lo único que se debe hacer son las llamadas a las funciones, asignándoles en algunos casos sus identificadores o sus parámetros en otros.
El código comentado seria el siguiente:
<?php
//Asignamos el nombre del TexArea: FCKeditor1
$oFCKeditor = new FCKeditor('FCKeditor1') ;
//Definimos la ubicación de la carpeta madre del editor (puede variar)
$oFCKeditor->BasePath = '/FCKeditor/';
//Asignamos el valor inicial del textarea de tenerlo, suele ser una variable que recupere el contenido de la base de datos para modificarlo, en este caso es un texto de muestra
$oFCKeditor->Value = 'Default text in editor';
//Ancho del TextArea
$oFCKeditor->Width = '100%' ;
//Alto del TextArea
$oFCKeditor->Height = '200' ;
// Finalmente creamos el textarea con el editor, bajo los parametros ya dispuestos
$oFCKeditor->Create() ;
?>
El código completo sería el siguiente:
<?php
include("FCKeditor/fckeditor.php") ;
?>
<html>
<head>
<title>FCKeditor - Sample</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<form action="savedata.php" method="post">
<?php
$oFCKeditor = new FCKeditor('nombre_del_textarea') ;
$oFCKeditor->BasePath = 'fckeditor/';
$oFCKeditor->Width = '700' ;
$oFCKeditor->Height = '500' ;
$oFCKeditor->Create() ;
?>
<br />
<input type="submit" value="Submit">
</form>
</body>
</html>
Esto es suficiente para tener nuestro editor instalado y funcionando correctamente, en un artículo posterior veremos como personalizarlo a nuestro gusto, que herramientas tomar y de cuales prescindir, además de los pasos a seguir para adaptar el explorador de archivos e imágenes.





Ya lo solucioné , sobraban las comillas en $descripcion;
- responder
Enviado por Gabi (no verificado) el Sáb, 05/27/2006 - 15:11.Muy interesante. Saludos.
- responder
Enviado por hugo (no verificado) el Lun, 06/12/2006 - 17:20.hola, muchas gracias por el artÃculo, me ha servido muchisimo. Saludos.
- responder
Enviado por Hector (no verificado) el Mié, 06/14/2006 - 14:05.Buenas, a ver si alguien me puede ayudar, eh instalado un programa llamado supernews que viene con el FCKeditor incorporado, lo que hice fue separarlo del directorio y ubicarlo en la raiz de mi servidor web, el problema es que no logro hacerlo andar desde entonces, eh leido el apunte de Balu, pero no logro entender como llamar al editor.Donde poner el codigo para llamarlo.Gracias.
- responder
Enviado por Remy (no verificado) el Lun, 06/26/2006 - 18:16.mi duda es q mi servidor es gratuito y no trabaaja con extenciones .js yo he resolvido mis problemas menores solo etiquetando con .php pero estoy es demasiado grande no hay otra fotma de conseguier q esto anda realmente me gusta mucho o
- responder
Enviado por german (no verificado) el Jue, 06/29/2006 - 10:40.Hola,Soy nuevo y estoy haciendo una prueba, me interesa mucho el tema sobre el FCKeditor, la opcion de registrarse en esta pagina da un error, y no se si por aki puedo realizar mis preguntas.Saludos,Arian
- responder
Enviado por Arian (no verificado) el Mar, 07/04/2006 - 04:57.Hola Baluart, ante todo agradecido por ser tan generoso con tus conocimientos, mi pregunta es la siguiente estoy instalando una tienda con oscomerce 2.2 MS2 y quiero integrar en el index.php de esta tienda el fckeditor 2.3 es posible hacerlo y como? Muchas gracias...
- responder
Enviado por Patrick (no verificado) el Jue, 07/13/2006 - 07:25.Todos los que no puedan configurar el administrador de imagenes de FCKeditor con PHP, acabo de hacerlo con la última versión 2.3.1. Pueden descargarlo desde este enlace.Descargar FCKeditor 2.3.1 para PHPEspero les sirva.Patrick, en el caso de los cms prefabricados es mejor buscar sus mods, o configurar uno.Saludos.
- responder
Enviado por Balú (no verificado) el Jue, 08/03/2006 - 10:55.Cómo puedo adaptar FCKEditor a phpnuke 7.9. para el módulo Content?
- responder
Enviado por YolandaGC (no verificado) el Vie, 08/11/2006 - 10:15.Buenas mi problema es el siguiente.Como puedo validar un fckeditor lo hago de la siguiente forma:if (document.fcurso.justificacion.value.length==0){ alert("Tiene que escribir la justificación para la Acción Formativa.") document.fcurso.justificacion.focus() return 0; }que es java script pero no se que hago mal, supogo que en la creacion del fckeditor se me olvida algo: <div id="izquierdad">Justificación:<?php$sBasePath = $_SERVER['PHP_SELF'] ;$sBasePath = '../../FCKeditor/' ;$oFCKeditor = new FCKeditor('justificacion') ;$oFCKeditor->BasePath = $sBasePath ;$oFCKeditor->Value = 'Justificación de la Acción Formativa.' ;$oFCKeditor->Create() ;?></div>esta es la parte de html donde creo el fckeditor, como se evalua el contenido de un fckeditor, please no se que hacer ya. Gracias
- responder
Enviado por Antonio Rueda (no verificado) el Mié, 08/16/2006 - 12:08.Antonio, descarga la configuración que publiqué hace poco, te será de ayuda. Fijate en el comentario 40.Por otra parte a que te refieres con justificar el fckeditor.Saludos.
- responder
Enviado por Balú (no verificado) el Mar, 08/22/2006 - 20:55.Hola a todos, yo quisiera saber si es posible cambiar el color de fondo del campo de edici
- responder
Enviado por Daniel (no verificado) el Dom, 09/17/2006 - 17:34.Buenas, baje la version configurada del FCKeditor y funciono muy bien, ahora tengo un pequeño problema al respecto... Uso el editor para el env
- responder
Enviado por Zandro (no verificado) el Mar, 10/17/2006 - 07:18.Hola Zandro, no sé por qué, yo no tuve ese problema cuando instalé el FCKeditor. Por lo que la soluci
- responder
Enviado por Bal (no verificado) el Mar, 10/17/2006 - 12:18.Buenas cuando dices: 1er Paso De la misma manera que en el caso anterior, lo primero es hacer una llamada, en este caso, al archivo fckeditor.php, mediante un include() o un require_once() dentro de las etiquetas head del HTML. El c
- responder
Enviado por g0nz4 (no verificado) el Mié, 10/18/2006 - 02:37.Gonz4 me refiero al archivo fckeditor.php, y lo insertas en la p
- responder
Enviado por Bal (no verificado) el Mié, 10/18/2006 - 11:44.¿Donde inserto la linea include("FCKeditor/fckeditor.php") ; para que al meter una noticia nueva salga el editor, pq no se donde he de meter esa line en que archivo en concreto? Saludos y gracias
- responder
Enviado por g0nz4 (no verificado) el Jue, 10/19/2006 - 00:39.HOla Balu... excelento este tema....Mira que estoy tratando de validar un texto que esta dentro del FCK pero no me funciona .. lo hago con java script como si fuera un campo normal de un formulario pero no coje.... arriba estube biendo que tratan el tema pero no encuentro solucion....
- responder
Enviado por Jose Luis S. (no verificado) el Lun, 10/23/2006 - 11:38.HOla Balu... excelento este tema....Mira que estoy tratando de validar un texto que esta dentro del FCK pero no me funciona .. lo hago con java script como si fuera un campo normal de un formulario pero no coje.... arriba estube biendo que tratan el tema pero no encuentro solucion....
- responder
Enviado por Jose Luis S. (no verificado) el Lun, 10/23/2006 - 11:38.una consulta miren soy novato en php genere el archivo ingresar.php<?php include("FCKeditor/fckeditor.php") ; ?> <html> <head> <title>FCKeditor - Sample</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body> <form action="savedata.php" method="post"> <?php $oFCKeditor = new FCKeditor('variable') ; $oFCKeditor->BasePath = 'fckeditor/'; $oFCKeditor->Width = '700' ; $oFCKeditor->Height = '500' ; $oFCKeditor->Create() ;?> <br /> <input type="submit" value="Submit"> </form> </body> </html>y despues genero el otro savedata.php<? echo $variable ?>pero no me deja el formato y las imagenes no me las muestra como puedo mostrar mi variable para que muestre el contenido en el savedata.php
- responder
Enviado por aLEJANDRO (no verificado) el Vie, 11/10/2006 - 06:50.Hola Balu, Tengo dos archivos .php, el primero es donde esta el formulario q contiene el fckeditor, y el segundo es a donde lo manda el metodo POST del formulario, ahora, no se como pasar la variable del textArea (q es donde esta toda la informacion escrita en el fckeditor, si entendi bien) a ese ultimo archivo q es donde hago una consulta para introducirlo en la BD, como hago eso amigo???? Uso php/mysqlGracias.
- responder
Enviado por Arian (no verificado) el Mié, 12/20/2006 - 19:30.Hola Balu, Tengo dos archivos .php, el primero es donde esta el formulario q contiene el fckeditor, y el segundo es a donde lo manda el metodo POST del formulario, ahora, no se como pasar la variable del textArea (q es donde esta toda la informacion escrita en el fckeditor, si entendi bien) a ese ultimo archivo q es donde hago una consulta para introducirlo en la BD, como hago eso amigo???? Uso php/mysqlGracias.
- responder
Enviado por Arian (no verificado) el Mié, 12/20/2006 - 20:09.Ya amigo Balu, despues de romperme la cabeza di con la solucion, jeje
- responder
Enviado por Arian (no verificado) el Mié, 12/20/2006 - 20:55.Balu: Como puedo cambiar el color del borde de una tabla usando PKCEditor. Saludos
- responder
Enviado por Jorge (no verificado) el Vie, 12/22/2006 - 12:40.Hola Jorge, ahora no recuerdo si se puede hacer directamente desde el editor html, sin embargo, puedes poner vista "c
- responder
Enviado por Bal (no verificado) el Vie, 12/22/2006 - 18:38.Hola: tengo un pequeño problema instalo el fckeditor y solo me funciona en Mozilla Firefox y no funciona en IE 6.0.2. En IE 6.0.2 aparece como si estubiera inabilitado ademas las ventanas de imagen y links no se puede ingresar en el servidor remoto.
- responder
Enviado por Andev (no verificado) el Vie, 01/26/2007 - 14:51.Hola una acotacion mas sobre el mensaje. La aplicacion es trabajado con PHP + Postgres y el manejado de plantillas Smarty
- responder
Enviado por Andev (no verificado) el Vie, 01/26/2007 - 14:54.Un error en IE dice:'FCK.Editor.Document,body' es nulo o no es un objeto
- responder
Enviado por Andev (no verificado) el Vie, 01/26/2007 - 15:08.Hola Andev, ¿c
- responder
Enviado por Bal (no verificado) el Vie, 01/26/2007 - 15:32.Ya borre los temporales pero nada no se q puede suceder. la aplicacion la inserto con: {fckeditor Value="$contenido" InstanceName="contenido" ToolbarSet="Custom"} desde la plantilla html.Pero en otras aplicaciones funcionaba bien solo que era una version anterior a la FCKEditor 2.3.2.Pues utilizo el FCKeditor 2.3.2 que contiene nuevas actualizaciones.
- responder
Enviado por Andev (no verificado) el Vie, 01/26/2007 - 16:50.Deja tu comentario