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.
Si te gustó este artículo también te gustará...
Hola Balú:Dando respuesta respuesta a la pregunta del post No.22 de este artículo, te comento que con el explorador del servidor no tengo ningún problema, sólo dá dificultades cuando utilizo la pestaña "Cargar" del cuadro de diálogo "Propiedades de la imágen".Mil gracias por tu respuesta anterior y por la ayuda que me puedas dar al respecto con este problemita.Saludos.
Hola Juanpa y Mellileo, en ambos casos sólo se me ocurren problemas de permisos. Por cierto, la carpeta UserFiles va en la raiz del sitio y en mi caso tienen permisos 777.La carpeta UserFiles tiene 3 subcarpetas: File, Flash e Image, cada cual para los distintos ficheros. Las 3 también en 777.Mellileo... Cuando se suben ficheros por el explorador, se almacenan en las respectivas subcarpetas; pero cuando se lo hace desde la pestaña cargar, se almacenan el la carpeta UserFiles. Por lo que hay la posibilidad de que sea la carpeta UserFiles la que necesite los permisos.Saludos.
por favor me pdroan expliacar como configuro para que la ventana me aparescan las ñ y las tildes estoy utilizando asp.
Soy yo de nuevo me olvidaba de felicitarte por el blog esta muy bueno .. y viva el Perú!
Hola Balu!Necesito cargar unas variables en FCKeditor.En el anterior editor de texto me funcionaba pero no se que hago mal.Este es el codigo<?php$oFCKeditor = new FCKeditor('descripcion') ;$oFCKeditor->BasePath = 'FCKeditor/';$oFCKeditor->Value = '$descripcion';$oFCKeditor->Create() ;?>Pero no me carga la variable, me sale en el campo de texto del FCKeditor $descripcion y no el contenido de la base de datos.GraciasSalutGabi
Hola Balu!Necesito cargar unas variables en FCKeditor.En el anterior editor de texto me funcionaba pero no se que hago mal.Este es el codigo<?php$oFCKeditor = new FCKeditor('descripcion') ;$oFCKeditor->BasePath = 'FCKeditor/';$oFCKeditor->Value = '$descripcion';$oFCKeditor->Create() ;?>Pero no me carga la variable, me sale en el campo de texto del FCKeditor $descripcion y no el contenido de la base de datos.GraciasSalutGabi
Ya lo solucioné , sobraban las comillas en $descripcion;
Muy interesante. Saludos.
hola, muchas gracias por el artículo, me ha servido muchisimo. Saludos.
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.
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
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
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...
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.
Cómo puedo adaptar FCKEditor a phpnuke 7.9. para el módulo Content?
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
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.
Hola a todos, yo quisiera saber si es posible cambiar el color de fondo del campo de edici
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
Hola Zandro, no sé por qué, yo no tuve ese problema cuando instalé el FCKeditor. Por lo que la soluci
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
Gonz4 me refiero al archivo fckeditor.php, y lo insertas en la p
¿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
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....
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....
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
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.
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.
Ya amigo Balu, despues de romperme la cabeza di con la solucion, jeje
Balu: Como puedo cambiar el color del borde de una tabla usando PKCEditor. Saludos
Páginas