5.177 leídas

Colorear código en WordPress

julio 07, 08 by Gerald | Puesto en Design, Herramientas, Tutorial

Inspirado en el post de Vinagreasesino donde se buscaba dar estilo al código en WordPress he encontrado un plugin para WordPress y paso a detallar el proceso de instalación:

Primero descargamos el CodeColorer desde el directorio de plugins de WordPress.

Luego deszipeamos el archivo y subimos el directorio codecolorer a la carpeta wp-content/plugins/.

Luego renombramos el archivo wp-content/plugins/codecolorer/codecolorer.css.in a wp-content/plugins/codecolorer/codecolorer.css

En mi caso estoy buscando colorear el código php y le añadido estas líneas al final del codigo de codecolorer.css :


.php .codecolorer .kw1 { color: #3300CC; font-weight: bolder; }
.php .codecolorer .kw2 { color: #000066; }
.php .codecolorer .kw3 { color: #3300CC; }
.php .codecolorer .kw4 { color: #DDE93D; }
.php .codecolorer .kw5 { color: #999966; }
.php .codecolorer .st0 { color: #333333; }
.php .codecolorer .es0 { color: #c3c3c3; }
.php .codecolorer .br0 { color: #330066; }
.php .codecolorer .nu0 { color: #CC0000; font-weight: bolder; }
.php .codecolorer .re0 { color: #000033; }
.php .codecolorer .re1 { color: #FFCC00; }
.php .codecolorer .re3 * { color: #FFFFFF; }
.php .codecolorer .re4, .php .codecolorer .re4 * {
color: #64A2FF;
}
.php .codecolorer .co1, .php .codecolorer .co2,
.php .codecolorer .coMULTI { color: #006633; }

Luego vamos al panel de control y activamos el Plugin.

Para su configuración vamos a opciones de configuración y ahí nos aparece este formulario :

CodeColorer

Aquí solo he cambiado el capo de CSS Style para que se adapte al diseño de mi blog y es así como los he dejado :


border: 2px dotted #143147; background: #E4F2FD; padding: 5px; margin: 10px;

Y active las opciones de Show line numbers(mostrar número de líneas) y Disable keyword linking (desactive los links de las funciones de php).

Después de todo estos pasos ya tenemos instalado nuestro plugin colorerdecoder con el cual, yo buscaba colorear el código php, y también aplicarlo a cualquier código y es así como lo uso :

[ cc lang="php"]codigo[/ cc] o <code lang="php">code</cc> ó también simplemente <code> código </code>

Como verán en este post he estado haciendo uso de este plugin y va de lujo!!

colorear codigo en wordpress

Saludos!!

Descarga CodeColorer.


Tambien te puede interesar

Tags: , , , ,

Añade tu comentario

Una respuesta para este post

  1. konkdekilo Says:

    Una pregunta se prodria utilizar para ver el editor de temas asi tambien
    un saludo!

Leave a Reply