Neeno y Manuel me han preguntado el método que utilizo para poder resaltar el código HTML, CSS, PHP, etc. etc. en mis entradas. Esto es posible en Wordpress gracias a un plugin llamado iG:Syntax Hiliter. El problema es cuando uno quiere resaltar código fuera de un CMS, como comenta Neeno. Para poder lograr esto, existen infinidad de scripts que lo hacen; pero ninguno tan poderoso (o al menos que yo haya encontrado) como GeSHi, que es el que hace funcionar al plugin antes mencionado.
GeSHi es un potente script que puede resaltar más de 60 lenguajes de programación y regresarlo en código XHTML y CSS. El único requerimiento es PHP 4.1.0 o mayor, por lo que practicamente cualquier servidor moderno puede correrlo. Puedes descargar el GeSHi e instalarlo y no te toma más de 10 minutos. Luego lees la documentación que viene en el zip bajo la carpeta de docs y aprendes a usarlo, pero por si eres demasiado flojo (como yo), entonces aquí un ejemplo que copipasteo descaradamente del FAQ de GeSHi:
- // Simple GeSHi demo
- // Include the GeSHi library
- include('geshi.php');
- // Make a new GeSHi object, with the source, language and path set
- $source = 'echo "hello, world!";
- // weeeeee!!!!';
- $language = 'php';
- $path = 'geshi/';
- $geshi = new GeSHi($source, $language, $path);
- // and simply dump the code!
Existen otras tantas soluciones para resolver el problema de resaltar el código, pero sinceramente GeSHi es el mejor que yo he encontrado; no vale la pena buscar más.
¡Espero esto sea de ayuda!
Edición
Aprovechando la entrada; el iG:Syntax Hiliter me da un error de XHTML válido (tags <a> rotas) con el código en HTML. Pueden verlo intentando validar cualquier página del blog que contenga código HTML resaltado. ¿Alguien sabe cómo arreglarlo o por qué sucede esto?
¡Caramba, que respuesta tan rápida! Gracias.
Una cosa que no sé si sabes (supongo que sí) es que el código sale resaltado también en CSS (es que ya te había agregado).
Y ya que estoy, un par de preguntas más: ¿que versión usas de WP? ¿Que plugin has usado para la nube de tags? Yo había probado alguno, pero no me convenció. También parece que has puesto uno para averiguar referrers, y saber el contenido de una búsqueda (por ejemplo en Google) que haya llevado al visitante hasta aquí, ¿cuál es ese plugin?
En fin, un blog muy bueno y con un aspecto fantástico, enhorabuena.
Con respecto a lo que mencionas sobre la validación, debo decir que con Firefox y la extensión Firebug lo valida. Tidy, también. La validación de Web Developer (que de hecho usa el de http://validator.w3.org), también, así que no encuentro los errores que mencionas...
El último de ellos, de hecho, recomienda que "si te has tomado la molestia de hacerlo tan bien, que puedes poner el icono de 'validado'", ya sabes cual.
Joer, ni un servicio de atención al cliente!! Ha sido comentar, orme para cama y al levantarme aqui una respuesta.
Qué grande eres!!
Por cierto, lo de los enlaces rotos... no he tenido tiempo de comprobarlo q llego tarde al curro. Pero me suena a que el validador en vez de encontrar la cadena entidad HTML equivalente, <a href etc...
Lo dicho, no lo he comprobado...
pss, vaya desastre de comentario que ha quedado!!! eso pasa por escribir las cosas con prisa... si eso bórralo que da vergüenza mirarlo además de q no se entiende lo que quería decir (y este tb.)
Manuel: ¡Gracias por los comentarios! Para saber qué versión de wordpress uso yo (o cualquier otra persona), basta con buscar en el código fuente y buscar la siguiente línea dentro de <head>:
<meta name="generator" ... />:
Esta meta tag tiene el atributo content que, como podrás ver en mi blog, tiene el valor "WordPress 2.0.5".
Para el plugin de la nube de tags, te recomiendo le eches un ojo a mi entrada "Páginas 404 útiles"; ahí vienen varios recomendados, además del que yo mismo uso.
El plugin para el referrer se llama landing sites, bastante amigable y útil.
El error lo puedes ver dando click aquí. La página validada es la entrada del menú circular, página 2 (donde viene el código HTML. Al validarla verás que hay tags <a> que están rotas.
Y en cuanto al ícono de validación de XHTML, si lo tengo, pero no el que ellos usan (no me gusta). En su lugar, tengo dos íconos hasta arriba y a la derecha, a un lado de donde están los íconos de los feeds, que validan XHTML y CSS.
Neeno: Jajaja, como en alguna ocación dije; metal.ize . Si tienen dudas, aquí estoy para ayudar a encontrar las respuestas.
En cuanto a tus comentarios... je, no he entendido bien, pues se ha cortado (joder, que tengo que poner eso en el formulario de comentarios: si quieren poner un tag en html, deben usar las entidades < y >. De lo contrario, Wordpress lo tratará como HTML y/o cortará su comentario.); pero si lo he editado, pues daba un error de HTML (dejaste dos "href" en el anchor, uno sin llenar); y los he unido en un solo comentario. Espero no te moleste.
No me molesta, solo que ahora que lo he comprobado, estaba equivocado en lo que quería poner en el anterior comentario. Y me quedo como tu, tampoco sé por qué no te valida esa página 2 del tutorial del menú circular.
el error que dá es que cierras una </a> sin abrir un <a href=""> pero examinando el código generado... encuentro que sí hay tal apertura del enlace... a saber.
No estoy muy metido en XHTML pero se supone que es solo para meter contenido, y en el source generado para el enlace de la línea 107 (el 1er error) lleva algo de javascript. ¿vendrá por aqui el error? aunque el validador se queje de otra cosa
Traté de quitar el código javascript pero la cosa sigue igual. Probablemente el error radique desde el html.php (el script que se encarga de identificar y resaltar el código html), puesto que ningún otro lenguaje me da ese error (sea CSS, Javascript o PHP, que son los que uso). A saber qué pasa con esa cosa.
Sin embargo esta página si que la valida perfectamente y también tienes puesto código resaltado. El problema es en la página 2 del menú circular... en fin
Neeno: Exactamente. Esta página valida perfectamente, pero el código resaltado es PHP. CSS, Javascript, PHP o cualquier otro que quieras valida perfectamente, pero cuando el código resaltado es HTML, la cosa se friega.
Además de no validar, lo que no me gusta nada de ese plugin es que al intentar copiar y pegar, van los números de línea también, con lo que es muy engorroso para el usuario que quiere utilizar esos pedacitos de código.
Pero muy bonito sí que queda sí...
Calitoe: Eso se puede arreglar. Si te fijas, arriba de cada código resaltado hay un link que dice "TEXTO PLANO". Da click en el y obtendrás un texto para copiar-pegar en bloc de notas sin los engorrosos números de línea.