Autor deambulando | en Internet, Programación, Software | el 13-03-2009
TinyMCE es el editor WYSIWYG preferido para la web. Pero este no incorpora un Upload para imágenes.
Existe un plugin que ellos te venden, pero como siempre podemos encontrar algo Open Source ;)
Ibrowser hace esto, un plugin para subir imágenes con TinyMCE, administrarlas, borrarlas etc…
Explico como lo haces funcionar:
- Descargarte la última versión de aquí http://j-cons.com/downloads/
- Crea una carpeta llamada ibrowser
- Todo el contenido del zip en la carpeta recien creada
- Pon esa carpeta dentro de la carpeta plugin del TinyMCE
- Abre el fichero config/config.inc.php del ibrowser y allí cambia las carpetas para el upload
$cfg['ilibs'] = array ( array ( ‘value’ => ‘/path/from/webroot/images/’, ‘text’ => ‘Sprekers’, ), array ( ‘value’ => ‘/path/from/webroot/gallery/’, ‘text’ => ‘Sponsors’, ), );
- Cambia el idioma con: $cfg['lang'] = ‘es’; en el mismo fichero
- Asegúrate de tener suficientes permisos en ibrowser/scripts/phpThumb/cache y ibrowser/temp
- Abre el fichero de configuración del tinyMCE (tiny_mce_config.js) y añade:
tinyMCE.init({ ... plugins : "ibrowser", ... theme : "advanced", theme_advanced_buttons3_add : "ibrowser", }); - Ahora abre tu web de prueba y ya debería de salirte un nuevo icono como este:

- Haz click en el ;)
Y te aparecerá algo como esto:

Links:
- http://tinymce.moxiecode.com/
- http://pascal.vanhecke.info/2005/08/25/image-upload-plugin-for-tinymce/
Recomendados:

Una muy buena opción sin duda!
Por cierto que bueno el detalle de la carita sonriente en la esquina izquierda y al final del site xDD
Y funciona genial! lo as probado? mola mazooo eheh
hahaha, eso lo ves por que no has usado firefox, no?
esa carita es de las stats de wordpress, no se por que lo ponen la verdad….
saludos rodrigoooooo
Hola. Estoy intentando implementar el Ibrowser en mi TinyMC, pero se me plantean unos problemillas.
- No he encontrado el archivo tiny_mce_config.js para poder realizar los cambios. Pero lo que es parecido, es como llamo yo al ibrowser en mi web:
tinyMCE.init({
mode : “textareas”,
theme : “advanced”,
});
He sustituido el codigo por esto:
tinyMCE.init({
mode : “textareas”,
plugins : “ibrowser”,
theme : “advanced”,
theme_advanced_buttons3_add : “ibrowser”,
});
y el boton de ibrowser aparece, pero no hace nada. ¿Me puede alguien asesorar? Muchas gracias.
esta en la carpeta de tu tiny mce plugins/ibrowser
ahi cambias eso, tambien verifica tengas los permisos adecuados ;)
Hola, he estado toda la tarde intentando implementar el TinyMCE con el ibrowser sin resultado ninguno : (
Me he bajado el último TinyMCE, el último ibrowser que ahora está en http://net4visions.com/index.php?id=10
He seguido todos los pasos pero no logro hacer que funcione.
En el readme de ibrowser pone esto que no logro entender muy bien que archivos hay que tocar:
copy the provided interface file: tinyMCE.editor_plugin.js file into your iBrowser plugin directory and rename it to “editor_plugin.js”. make a copy of it and rename it to editor_plugin_src.js.
El único paso de los relatados en tu post que no entiendo muy bien es el:
Abre el fichero de configuración del tinyMCE (tiny_mce_config.js) y añade…
¿Ese fichero de configuracion es para webs modulares tipo joomla y demás?
Yo estoy trabajando sobre un simple formulario en un servidor apache bajo windows xp, aunque también lo he probado en un linux, y tampoco logro que me salga el icono.
¿Tienes idea de que puede pasar?
Gracias de antemano y un saludo.
hola!
el tiny_mce_config.js, debes de tenerlo en cualquier instalacion de tiny, no?
igualmente te recomiendo mejor el foro oficial para ayudas de este tipo
saludos!
Hola, al final conseguí que funcionara tras mucho romperme la cabeza jeje.
Lo del archivo tiny_mce_congif.js no existe ni en el tiny ni el ibrowser, no se si en otras versiones distintas a la mia estará, pero lo que en el paso 8 dices que hay que poner ahí, ahora se pone en la propia página del formulario.
Cuento un poco lo que he hecho por si alguien llega aquí con el mismo problema, en mi caso ha sido trabajando con tinymce 3.2.6, y con ibrowser 1.3.9
- Hasta el paso 8 todo es igual. (Puede que tengas problemas con la ruta a las imagenes, se soluciona probando diferentes formas de poner la ruta, jeje. Creo que aunque el tiny esté dentro de algun directorio de carpetas, las galerias empieza a buscarlas desde la raiz del servidor.)
- Después hay que seguir los pasos que te dice el readme del ibrowser:
· Copiar tinymce/plugins/ibrowser/interface/tinyMCE3.0_editor_plugin.js (cada uno copiará el que corresponda con su tiny)
· Pegarlo en la carpeta tinymce/plugins/ibrowser/ (Antes renombrar el .js que hay por editor_plugin_src.js, y ahora el tinyMCE3.0_editor_plugin.js renombrarlo por editor_plugin.js)
- Observaciones:
· Con versiones superiores a la 2.9.0 de php no funciona la vista previa del ibrowser
· En safari aparecerá el icono del ibrowser en el formulario pero no se abrirrá la ventana. El resto del tiny si funciona. (Puede que sea un error mio, seguiré investigando)
Un saludo! : )
Me equivoqué con la versión de php… se trata de versiones iguales o superiores a la 5.3.0
Ahí deja de funcionar la vista previa. Si quieres edita el anterior comentario y borra este.
Un saludo.
muchas gracias javier por tu aporte!
saludos
Por favor podrian decirme como deberia ser la ruta para subir las imagenes en un servidor. por que el ibrowser me funciona bien en el localhost pero cuando subo la página web al servidor las imagenes no se muestran
Si alguien puede ayudarme se loa agradeceria mucho…
Creo que el plugin no este más en la web que haces referencia. Intente bajarlo pero no lo ví por ningún lado. Luego de mucho probar lo encontré en http://www.net4visions.com/downloads.html un sitio que tiene el mismo diseño que el anterior por lo que deduzco que deben ser de la misma empresa.
Salu2