Contenido

Extiende las opciones del TinyMCE

3 Abr

+ 7

Via La Maté por un Yogur, descubro este hack para wordpress 2.0.x que permite añadir funcionalidades al editor visual.

Una de las novedades que trae WordPress 2 es la inclusión de serie del editor visual TinyMCE con algunas opciones básicas, como negritas o alineado de texto.

Para que podamos agregar funcionalidades como encabezados o color de texto, tenemos que editar el archivo de configuración dentro de nuestra instalación de WordPress :

/wp-includes/js/tinymce/tiny_mce_gzip.php
    

En la linea 127 podemos ver :

$mce_buttons = apply_filters(’mce_buttons’, array(’bold’, ‘italic’, ’strikethrough’, ’separator’, ‘bullist’, ‘numlist’, ‘outdent’, ‘indent’, ’separator’, ‘justifyleft’, ‘justifycenter’, ‘justifyright’ ,’separator’, ‘link’, ‘unlink’, ‘image’, ‘wordpress’, ’separator’, ‘undo’, ‘redo’, ‘code’, ‘wphelp’));
    

Donde cada item del array es un boton del editor, siguiendo la lista de controles disponibles en TinyMCE, para colocar un selector de formato, otro selector de tamaño y un botón para colorear el texto agregamos :

$mce_buttons = apply_filters(’mce_buttons’, array(’bold’, ‘italic’, ’strikethrough’, ’separator’, ‘formatselect’, ‘fontsizeselect’, ‘forecolor’, ’separator’, ‘bullist’, ‘numlist’, ‘outdent’, ‘indent’, ’separator’, ‘justifyleft’, ‘justifycenter’, ‘justifyright’ ,’separator’, ‘link’, ‘unlink’, ‘image’, ‘wordpress’, ’separator’, ‘undo’, ‘redo’, ‘code’, ‘wphelp’));
    

Dando como resultado :

editorextendido2.jpg

Si te queda chico el espacio podrias ponerlo en la siguiente fila utilizando el código que se encuentra unas líneas abajo en el mismo archivo de configuración:

$mce_buttons_2 = apply_filters(’mce_buttons_2′, array(‘formatselect’, ‘fontsizeselect’, ‘forecolor’, ’separator’));
    

No tienes que limitarte a la lista de caracteristicas básicas, usando plugins de TinyMCE podrias ampliarlo para el uso de tablas o inserción de archivos flash.

 Original | backdraft: usabilidad, desarrollo web, peruanismos varios.

  • Estoy tratando de implementar el plugin para la insercion de archivos flash pero la documentacion es horrible, no se entiende un carajo. me podrias ayudar?

  • Hola Andres:

    Antes que nada me encanta tu blog!, no solo es bueno en el aspecto tambien lo es en el contenido. Te comento que hace dos semanas me meti de lleno con esto del wordpress ya tengo todo listo para publicar mi sitio siguiendo muchos de tus consejos y usando algunos de tus plugins :).
    Pero al publicarlo tengo un problema del cual trata este post. Bueno casi, el drama viene con las iconos del TinyMCE en el editor que no aparecen! ni el formato correcto, como me lo da en la pc (donde tambien lo tengo instalado), a parte con un mensaje que dice; error ‘tinyMCE’ no esta definido linea 162 codigo 0. Esto me sale despues de instalarlo en el servidor sin hacer ningun cambio que se pueda relacionar con este post.
    Para mi seria un gran alivio si me pudieces ayudar sobre este tema, ya que he buscado en toda la internet y no veo respuesta a este inconveniente.
    P.D.: Uso la ultima version del wp, y gracias x tu tiempo 🙂

  • Me gustaría añadir algo: A mi me sucedió que cambiaba y no aparecían los botones de la lista 2 o 3, es porque (al menos mi WP) tenía una nueva declaración para la variable $mce_buttons_3 que la hacía vacía de nuevo:
    $mce_buttons_3 = apply_filters(‘mce_buttons_3’, array());
    Así que a los que les pase lo mismo, revisad si es que teneis esa misma declaración y eliminadla, tanto para $mce_buttons_3 como $mce_buttons_2.
    Saludos 😉

  • Hola, he leído tu blog y en la parte de añadir nueva barra en tinyMCE me sale una duda. Los botones los introduce bien, pero, como se hace una lista desplegable?
    Al iniciar el editor, se declaran nuestros botones y le damos la funcionalidad que queramos, pero una lista no.
    Haber si me podéis ayudar para hacer una lista desplegable tipo formatselect pero con mis botones.

    Un saludo y gracias.

    PD: me puedes enviar un correo contestando si no es mucha molestia.

Comentar

#

Me reservo el derecho de eliminar y/o modificar los comentarios que contengan lenguaje inapropiado, spam u otras conductas no apropiadas en una comunidad civilizada. Si tu comentario no aparece, puede ser que akismet lo haya capturado, cada día lo reviso y lo coloco en su lugar. Siento las molestias.