Recordemos que la imagen featured (o thumbnail) se define cuando se publica un post, por lo que el plugin W3 Total Cache se habrá llevado al CDN todas las imágenes asociadas al post en el momento de la publicación y no tendrá cualquier otra que se cree posteriormente (como puede pasar con vt_resize).

Una posible solución es utilizar la función wp_get_attachment_image_src que devuelve un array con la URL, el ancho y la altura de una imagen adjuntada a un post. Si se quiere el src de la imagen se puede obtener con el primer elemento del array devuelto por la funcion.

Recordemos también que una imagen adjuntada a un post es la que se sube a la instalación de WordPress en el momento de publicar el post o con la opción “Add new” del apartado “Media”.

De esa forma, podemos utilizar el siguiente código PHP para redimensionar una imagen a 280×257 por ejemplo:

<?php
$thumb = get_post_thumbnail_id();
$image = wp_get_attachment_image_src($thumb, ‘full’);
?>
<img src=”" width=”280″ height=”257″ alt=”image”/>

Donde $image[0] es el primer elemento del array devuelto por wp_get_attachment_image_src

Con get_post_thumbnail_id se obtiene el ID de la imagen featured (o thumbnail) adjuntada al post. Si no se adjuntó ningún thumbnail, la función devuelve un valor vacio. Para que un theme pueda utilizar imágenes featured, hay que incluir la siguiente sentencia en el archivo functions.php del theme activo (ver Post Thumbnails) o estar activado en una instalación multisite.

add_theme_support( ‘post-thumbnails’ );

[Fuente de la imagen: google.tecnoad.com]

El viernes que viene inauguraremos en Blogpocket la sección “La semana en imágenes” que será un resumen gráfico de los más significativo que hemos publicado en los últimos 7 días.

Hoy, dedico esta entrada a explicar cómo lo he implementado.

Para poder mostrar un listado de imágenes (una por cada post), evidentemente lo primero que hay que tener en cuenta es que cada entrada debe llevar asociada una. Para ello, utilizaremos las imágenes en miniatura (thumbnails) que, desde la versión 2.9, es capaz de gestionar WordPress.

Si tienes una instalación “multisite” no te debes preocupar porque tienes la función incluida en el editor de posts (un widget en la columna lateral con el que puedes añadir una “Featured image” o “imagen destacada”). Sin embargo, en una instalación normal tienes que añadir la siguiente instrucción en el archivo functions.php para activarla:

add_theme_support( ‘post-thumbnails’ );

Una vez que tenemos definida una imagen en miniatura (mediante el widget “featured image” del editor de posts) solo hay que saber extraerla con el correspondiente código PHP. En el blog Aurea encontrarás una buena explicación acerca de cómo programarlo: Thumbnail en WordPress; Mostrar 5 últimos posts con thumbnails.

Yo he utilizado el plugin Category Thumbnail List para no tener que gastar ninguna neurona. Para mostrar la tabla con las imágenes solo hay que añadir el shortcode siguiente, en cualquier lugar del post:

[categorythumbnaillist September, 10 2011]

Siendo “September, 10 2011″ la fecha a partir de la cual queremos mostrar posts. El plugin originalmente lleva el número ID correspondiente a la categoría de los posts que se quieren mostrar, en lugar de esa fecha. Ese identificativo se obtiene en la página de categorías poniendo el cursor encima de la categoría concreta que se va a utilizar. Esto quiere decir, además, que cuando edites una entrada, cuyo thumbnail va a salir en la galería, tienes que asignarle la categoría con ID “n”. Acuérdate también de poner el nombre del post como título de la imagen, ya que el plugin utiliza el nombre de la imagen para mostrar como descripción cuando se sitúa el cursor encima de ella.

Para configurar el tamaño de las imágenes en miniatura, el plugin añade una página de opciones en la columna de “Settings” del escritorio (yo he escogido 170×170), pero hay que asegurarse de elegir el tamaño miniatura al definir la “featured image“.

WordPress posee una opción de “Media” (galería de elementos multimedia) con la que, una vez definida la “featured image” para cada post, siempre puedes modificar sus características a posteriori (nombre, tamaño, etc.).

El plugin Category Thumbnail List tiene una hoja de estilos CSS con la que puedes adornar la lista totalmente a tu gusto.

Por último, el plugin muestra, debajo de cada imagen, el título del post. Si te parece mejor que la imagen aparezca sola, hay que quitar la siguiente instrucción:

$output .= ‘<a href=”‘ .$link . ‘” title=”‘ .$title . ‘”>’ .$title . ‘</a><br/>’;

Y para mostrar las imágenes que tengan la categoría “n”, hay que cambiar la instrucción:

$myposts = get_posts(‘numberposts=-1&&category=’.$listCatId[1].’&&orderby=’.$categoryThumbnailList_OrderType.’&&order=’.$categoryThumbnailList_Order);

por:

$myposts = get_posts(‘numberposts=-1&&category=n&&orderby=’.$categoryThumbnailList_OrderType.’&&order=’.$categoryThumbnailList_Order);

Si se quieren visualizar solo 9 imágenes, por ejemplo, hay que hacer que el bucle solo se ejecute 9 veces. Para ello, se utiliza la variable $i.

Nótese que para que las imágenes se muestren según el parámetro de fecha del shortcode hay que comparar la fecha del post con la fecha en la que se muestran las imágenes. La del parámetro del shortcode se calcula con la instrucción:

$fecha_lim = $listCatId[1];

Y solo se muestran imágenes si se cumple la condición

($fecha <= $fecha_lim) and ($i<10)

Es decir, cuando la fecha del post es menor que la que lleva el shortcode y todavía no se han visualizado 9 imágenes. La fecha del post es $fecha y se obtiene extrayéndola del post con la sentencia.

$fecha = get_the_date();

Si actualizas alguna vez este plugin, acuérdate de volver a realizar estas dos modificaciones y los posibles cambios en el CSS.

A continuación, puedes descargar el plugin modificado: download.

Estas son las versiones de PHP, MySQL, Chrome, Safari, Explorer, Opera y Firefox que admitirá WordPress 3.2. En el caso de PHP y MySQL son obligatorias y en el resto recomendadas.

PHP 5.2.4 o superior
MySQL 5.0 o superior
Chrome 11 o superior
Firefox 4 o superior
Safari 5 o superior
Opera 11.10 o superior
Internet Explorer 9 o superior

Además, se requerirá que el módulo mod_rewrite de Apache esté cargado.

Las recomendaciones acerca de las versiones del navegador son en base a la iniciativa Browse Happy.

Para saber si el servidor adonde tienes instalado tu blog de WordPress.org (la versión instalable de WP) está preparado para poder actualizar la versión, solamente tienes que crear un archivo con el siguiente contenido, darle el nombre “phpinfo.php”, subirlo al servidor y ejecutarlo desde la barra de direcciones de tu navegador.

<php echo phpinfo(); ?>

En la tabla de resultados “apache2handler”, en la sección “Loaded Modules” tiene que aparecer “mod_rewrite” entre los módulos que están cargados; mientras que en la tabla “mysql”, en la sección “Client API version”, verás la versión de MySQL. En la cabecera tendremos la versión de PHP.

Las versiones activas de WordPress, PHP y MySQL también se obtienen instalando el plugin LAMP Versión Checker pero ya sabes que no hay que agobiar a tu WordPress con tanto plugin .

• PHP para principiantes
• Cómo instalar un servidor local con PHP
• Cómo instalar MySQL en Mac

Hay mucha más información en la categoría PHP.

Los paquetes más conocidos y utilizados que incluyen integrados el servidor, el entorno de programación PHP y el gestor de bases de datos son XAMPP, EasyPHP y MAMP (exclusivo para maqueros) pero existe un gran número de ellos. En Opciónweb los han recopilado casi todos: 20 paquetes Apache, MySQL y PHP.

Manejar los datos que ofrece la API de Twitter es muy fácil con PHP. Más concretamente, con la librería Twitterlibphp.

Con dicha librería, se puede convertir cualquier petición a Twitter en un archivo en formato XML, tal y como se explica en Use PHP to convert Twitter to RSS.

Y en el blog Woork hay un magnífico ejemplo para aprender a obtener la típica salida de items del timeline de Twitter: Super simple way to work with Twitter API (PHP + CSS).

Así que aprovechando la url de procedencia de los comentarios procedentes de Twitter hay que modificar las líneas del archivo comments.php que buscaban “Topsy page” en el contenido del comentario y cambiarlas por:

if (preg_match(’|twitter|’, $comment->comment_author_url))

para encontrar “twitter” dentro de la url del autor del comentario.

Para ello, se utiliza la función WP_Query con la que se obtienen en la variable $recent todos los posts (tantos como indique la variable $showposts). Con la variable $cat (el identificativo numérico) se filtran los posts a una categoría específica.

El siguiente bucle es el utilizado para Tinta Digital, simplificado lo más posible para que se pueda entender a primera vista. Con él, podríamos visualizar los 3 primeros posts de la categoría número 3 (su título con el permalink, el resumen, el autor con su enlace y los comentarios realizados con su enlace, respectivamente).

<?php $recent = new WP_Query(“cat=3&showposts=3″); while($recent->have_posts()) : $recent->the_post();?>
<a href=”<?php the_permalink(); ?>”><?php the_title(); ?></a>
<br />
<?php the_excerpt(); ?>
<br />
<?php the_author_posts_link(); ?>
<br />
<?php comments_popup_link(‘(0)’, ‘(1)’, ‘(%)’); ?>
<br /><br />
<?php endwhile; ?>

En este post abordamos qué modificaciones hay que realizar en el archivo comments.php del theme.

El truco está en aplicar la clase “author” o la clase “topsy” (de acuerdo a las definiciones que vimos en el post anterior) a las etiquetas DT y DD, según el tipo de comentario (del administrador o del plugin Topsy). O no aplicarle ninguna clase si el comentario es de un lector.

En php esto se podría hacer de la siguiente forma (por ejemplo para la etiqueta DT, y de igual forma para la etiqueta DD):

<dt <php echo $clase; ?>>

De tal forma que si la variablel $clase tiene el valor vacio, nos quede:

<dt>

Y eso valdría para los comentarios generales. Sin embargo, si la variable toma el valor class=”author”, tendremos:

<dt class=”author”>

Y si vale class=”topsy”:

<dt class=”topsy”>

Ahora bien, ¿cómo determinamos si el comentario es de un tipo o de otro?. Simplemente tendremos que preguntar si e-mail del comentario es el mismo que el del administrador para saber que éste es el autor o si en el texto del comentario viene incluido “Topsy page” por si proviene del plugin. Para ello se utilizan las funciones get_the_author_email, de WordPress; y preg_match de php.

Primero se asigna el valor vacio a la variable $clase. Después, se evalua si el e-mail del comentario es el mismo que el del administrador. En caso afirmativo, se asigna el valor class=”author” a la variable $clase; y en caso contrario, se evalua si el comentario contiene “Topsy page”. En caso afirmativo, se asigna el valor class=”topsy” a la variable $clase y, en caso contrario, no se hace nada. El código serías más o menos así:

$clase=”";
<?php if ($comment->comment_author_email == get_the_author_email()) {    $clase=”class=’author’”;
}
else {
if (preg_match(‘|Topsy page|’, $comment->comment_content)) {
   $clase=”class=’topsy’”;
}
}
?>
<dt <php echo $clase; ?>>

Los bocadillos para los comentarios del theme Copyblogger tienen dos colores: amarillo para el administrador y gris para los que envían los lectores.

Copyblogger utiliza dos imágenes (comment_author_top.gif y comment_author_bottom.gif, respectivamente) para formar los bocadillos del administrador:

y

Lo primero que hicimos fue crear dichas imágenes en color azul celeste (comment_topsy_top.jpg y comment_topsy_bottom.jpg), un nuevo tipo de bocadillo para los comentarios del plugin Topsy. Para ello utilizamos la aplicación Paintbrush de Mac OS X, que permite elaborarlas con un par de clicks, subiendo las nuevas imágenes al directorio “images” del theme.

A continuación se modificó la hoja de estilos CSS, de la siguiente forma. Copyblogger emplea las etiquetas de definición DL, DT y DD para maquetar cada bloque de comentarios (aquí hay una buena explicación de cómo funcionan las listas de definiciones). Con DT se coloca la cabecera, con el número de comentario, el autor y la fecha y hora. Con DD se pone el texto del comentario. DT y DD llevan en el CSS un background con las respectivas imágenes que forman la parte superior e inferior del bocadillo. Para esto se utilizan las siguientes instrucciones:

dl#comment_list dt { padding: 0 0 33px 0; background: url(‘images/comment_top.gif’) 0 100% no-repeat; font-size: 1.3em; line-height: 1.3em; color: #999; }

dl#comment_list dt.author { background: url(‘images/comment_author_top.gif’) 0 100% no-repeat; }

…

dl#comment_list dd { font-size: 1.2em; width: 428px; padding: 0 20px; margin: 0 0 1.5385em; background: #dfdfdf url(‘images/comment_bottom.gif’) 0 100% no-repeat; }

dl#comment_list dd.author { background: #f6f4c9 url(‘images/comment_author_bottom.gif’) 0 100% no-repeat; }

comment_top.gif y comment_bottom.gif son las imágenes en gris. Se utilizan los códigos de color: #dfdfdf (gris) y #f6f4c9 (amarillo).

Lo único que hay que hacer es añadir dos líneas más, para el nuevo color del Topsy (celeste, código #aff6fe):

dl#comment_list dt.topsy { background: url(‘images/comment_topsy_top.jpg’) 0 100% no-repeat; }

…

dl#comment_list dd.topsy { background: #aff6fe url(‘images/comment_topsy_bottom.jpg’) 0 100% no-repeat; }

Por último, cocinamos un poquito de html en el archivo comments.php para distinguir si el comentario está hecho por el administrador, por el plugin o por cualquier lector. Pero eso lo dejamos para la segunda parte de este post.

[Link a todos los posts publicados sobre Campus Party]

SELECT * FROM wp_posts WHERE ID<1000

se obtienen todos los registros de los 999 primeros posts de la tabla de WordPress “wp-posts” (la que guarda todo el contenido). El campo ID es el identificativo numérico de cada post y su valor va creciendo de uno en uno a medida que vamos publicando anotaciones.

Con la función mysql_query enviamos una consulta a la base de datos activa y el resultado obtenido puede pasarse a la función mysql_fetch_array con objeto de manejarse como una tabla (una tabla es una estructura de datos en la que cada elemento puede indexarse mediante un valor numérico ordenado o cualquier otro valor -literal, lógico, etc.-).

De esta forma, la instrucción:

$result = mysql_query(“SELECT * FROM wp_posts WHERE ID<1000″);

ejecuta la consulta y:

$row = mysql_fetch_array($result)

lo convierte a formato tabla e introduce el resultado en la variable $row. Con los nombres de cada campo de la tabla como literal podremos indexar cada elemento: $row['ID'] (el ID), $row['post_title'] (el título del post), $row['post_content'] (el contenido del post) o cualquier otro.

Finalmente, solo es necesario poder “recorrer” toda la tabla para mostrar todos sus elementos. Eso se puede hacer con la instrucción “while” (mientras que) que recorrerá las filas de la tabla mientras existan elementos en ella (cosa que se realiza incluyendo como condición la expresión $row = mysql_fetch_array($result)).

Si tienes tu blog instalado en tu propio servidor con WordPress, tal vez sientas curiosidad sobre los entresijos. Básicamente, WordPress es una base de datos MySQL y sus tablas se pueden ver y modificar con la herramienta phpMyAdmin.

Pero la estructura de datos se puede también manipular mediante scripts de PHP. Para cualquier operación con la base de datos desde PHP, lo primero que hay que hacer es conectarse a la misma. A continuación, se puede ver el código correspondiente a un programa que se conecta a la base de datos “basededatos”, mediante el usuario “usuario” y la password “password”.

<php
$conexion = mysql_connect(“localhost”,”usuario”,”password”);
if (!$conexion)
{
die(‘No se puede conectar: ‘ . mysql_error());
}

else
{
echo “Conexion ok”;
mysql_select_db(“basededatos”, $conexion);
}
?>

La función mysql_connect realiza la conexión con la base de datos y la función “mysql_select_db” establece la base activa sobre la que se ejecutarán las operaciones.

La variable $conexion tomará el valor lógico “cierto” si el intento de conexión es satisfactorio y “falso”, en caso contrario. El operador de negación (!), como condición de la sentencia “if”, se utiliza para provocar la parada del script mediante la función “die” solo en el caso de que no se haya establecido la conexión. En caso fallido, se ejecuta la parte del “else” (si no) para seleccionar la base de datos con mysql_select_db.

En el próximo post veremos cómo podemos acceder a las tablas de WordPress.

En WordPress es muy fácil extraer información de la base de datos de un blog con la función get_results. Esta función devuelve como salida un array con el resultado de una query (una consulta a la base de datos).

En el caso del script siquiente, cada fila del array es un post con los campos comment_count (número de comentarios al post), ID (número único e identificativo del post) , post_title (título del post) y post_date (fecha de publicación del post). La consulta, a la base de datos de los posts, selecciona esos campos siempre y cuando el valor del campo de fecha (post_date) se encuentre entre el 1 de enero de 2008 y el 31 de diciembre de 2008. El resultado se ordena descendentemente por el campo comment_count (número de comentarios de un post), guardando los 10 primeros registros que cumplan estos requisitos.

La variable $result contendrá la información de esos 10 registros obtenidos tras llamar a la función get_results. Simplemente hay que recorrer, a continuación, ese array (cuestión que se hace con la instrucción foreach) mostrando, si el contador de comentarios (comment_count) es distinto de cero, el título del post con su permalink (obtenido con la función get_permalink).

<ul>
<?php
$result = $wpdb->get_results(“SELECT comment_count,ID,post_title, post_date FROM $wpdb->posts WHERE post_date BETWEEN ’2008-01-01′ AND ’2008-12-31′ ORDER BY comment_count DESC LIMIT 0 , 10″);

foreach ($result as $topten) {
$postid = $topten->ID;
$title = $topten->post_title;
$commentcount = $topten->comment_count;
if ($commentcount != 0) {
?>
<li><a href=”http://www.blogpocket.com/2009/01/02/como-obtener-los-posts-mas-comentados-de-2008/”><?php echo $title ?></a></li>
<?php }
}
?>
</ul>