Officefull.es

Excel, word, powerpoint, android

Agregar estilos CSS en Editor TynMCE Joomla Agosto 27, 2011

Agregar estilos css

En una web son muy necesarios los estilos y formatos. Por defecto todos los editores tienen sus propios estilos que vienen predefinidos y algunos de ellos se pueden personalizar. Uno de los editores que viene con Joomla es TynMCE y es muy fácil de manejar.

AGREGAR LOS ESTILOS EN EL DESPLEGABLE STYLES

1 Creamos dos estilos CSS de prueba:

El estilo demo1 sencillo y el estilo demo2 más elaborado.

/*Estilo demo1 y estilo demo2*/ .demo1{ background-color:#33FF99; color:#CC3300;} .demo2{margin: 15px 0;padding: 10px;        padding-left: 40px;text-align: justify;color: #7D7D7D;        background: #FEFCD3 url(../images/tools/reloj.png) no-repeat;        border-top: 1px solid #CCCCCC;        border-bottom: 1px solid #CCCCCC;} /***/

Agregar estilos css

2 Copiamos y pegamos el código en el CSS de la plantilla que utilizamos por defecto en la web. Por ejemplo en la plantilla que utiliza esta Web, hemos utilizado el CSS llamado tools.css. (Se puede utilizar cualquier CSS que por defecto utilice la web, algunas plantillas utilizan CSS llamados (templates.css, style.css, etc…)

/templates/templateX/css/tools.css

3 Una vez realizado el punto 2, abrimos el CSS que utiliza el editor y escribimos los estilos SIN Código (no es necesario añadir el código) en la ruta siguiente:

Archivo que utiliza Joomla para el editor./templates/system/css/editor.css

Agregar estilos css

4 Y por último, ahora una vez guardado todo, comprobamos que aparecen los estilos en el desplegable Styles del editor TynMCE.

Comprobamos que funcionan correctamente en un artículo de prueba:

Agregar estilos css

Si se seleccionan partes de texto genera el siguiente código:

Agregar estilos css

Agregar estilos css

Si se seleccionan párrafos completos:

Agregar estilos css

Agregar estilos css

Anotación

También, dependiendo de las plantillas instaladas, puede crearse un archivo llamado editor.css en la carpeta CSS de la plantilla utilizada y crear los estilos en este archivo creado, para mostrarse en el editor de joomla.

Categorías: Sin categoría

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *