Hace meses apareció Tumblr, y de repente los tumbelogs se hicieron “famosos”; a pesar de que algunos lo creen asÃ, es incorrecto pensar que nacieron en ese momento, puesto que al menos desde 2005 el concepto era conocido —Jason Kottke, en una anotación de octubre de ese año los describe asÃ:
Un tumblelog es un flujo de consciencia rápido y sucio [quick and dirty, también “improvisado”], un poco como una lista de enlaces pero con más que sólo links […] mÃnimos comentarios, poca charla entre blogs, el mÃnimo suspiro de un trabajo final, casi pura edición… en realidad, es sólo una manera de publicar rápidamente las “cosas” que te encuentras todos los dÃas en la web
Hoy podrÃamos decir: algo entre Twitter y un blog, mezclado con Flickr, del.icio.us y YouTube… más una pizca de IM
Tumblr es realmente una herramienta fantástica: gratis, sin publicidad, con un buen diseño, bien enfocada a lo que pretende lograr, muy fácil de usar, personalizable… sin embargo, como rezaba la presentación de proyecto de software web de por ahà (no recuerdo cual), “también pagamos una buena cuenta de web host”, y si me gustara simplemente utilizar las cosas que ya están hechas probablemente no necesitarÃa pagarla.
Hace un rato, pecesama anunció que estaba desarrollando gelato, un CMS instalable y de código abierto orientado a la gestión de tumblelogs que aún está en fase de desarrollo, pero desde algo antes habÃa estado deseando poder ocupar WordPress para crear y gestionar un tumblelog. Claramente, esto tiene tanto de desafÃo como de obstinación: WordPress está diseñado esencialmente para gestionar weblogs, pero su sistema de themes es lo bastante flexible y la disponibilidad de plugins suficientemente extensa como para poder llegar a funcionar como un gestor de contenidos “genérico”.
Por ello, hace tiempo decidà intentar crear mi propio tumblelog con WordPress, y a esta fecha ya podrÃa decir que tengo una instalación que de manera medio artesanal y con más de alguna maña… funciona… pero que al mismo tiempo me permitirÃa seguir moldeándola a mis necesidades (por ejemplo, agregando más tipos de contenido que videos, conversaciones, citas, posts e imágenes, para incluir documentos, descargas, etc.)
Bueno, y ¿cómo?
Actualización: he creado un tema para WordPress que se encarga de la mayorÃa de estas tareas, lo que permite mantener un sitio tipo-tumblelog con este CMS. Puedes revisarlo acá: Typographic â yukei.net
Preliminares
En primer lugar, he de decir que esto lo intenté en un weblog (casi)nuevo, con lo que me he ahorrado el posible trabajo de tener que ajustar los contenidos anteriores al nuevo formato. Por lo tanto, primera cosa necesaria: una instalación nueva de WordPress… también se podrÃa hacer con una con más tiempo, pero necesitarÃa más trabajo.
A partir de ahÃ, sólo hubo tres cosas que fueron realmente necesarias para hacerla funcionar como un tumblelog:
- Un sistema ordenado de categorÃas
- Un tema (o theme) especialmente diseñado para contenidos tipo tumblelog
- Un par de funciones en PHP para controlar algunos tipos especiales de contenido: citas y conversaciones
Poniéndolo a funcionar
Las categorÃas
¿Porqué es necesario un sistema ordenado de categorÃas? Básicamente, porque va a ser la forma en que podemos dar a cada post un estilo especial, marcando cada post según su tipo más que por su contenido; de acuerdo con esto, definà las siguientes categorÃas:
- Audio
- Cita
- Conversación
- Documento
- Enlace
- Foto
- Post Normal
- Video
Luego, en el theme creo un contenedor para cada post con el atributo class="post...
más esta función como valor: <?php $cat = get_the_category(); $cat = $cat[0]; echo $cat->category_nicename; ?>
, de modo que cada entrada tiene una clase de la siguiente forma: class="post video"
.
Y con eso es básicamente suficiente para diferenciar los posts por tipo. Sin embargo, una de las cosas más cool de Tumblr son los estilos automáticos que se aplican a dos tipos de contenidos: las citas y las conversaciones.
Como de todos modos querÃa aplicar algún descriptor de acuerdo al contenido, simplemente instalé Ultimate Tag Warrior para aplicar etiquetas.
Las funciones
En mi caso, preferà controlar todo esto mediante el theme. Mi loop tiene esta forma:
<div id="contenido">
<?php if (have_posts()) : while (have_posts()) : the_post() ?>
<?php if(in_category(12)) /*si es una cita*/ { ?>
<div class="post cita <?php measure_quote()?>">
<h2><a href="<?php the_permalink()?>" title="Enlace directo a este post"><?php the_ID()?></a></h2>
<?php the_content()?>
</div>
<?php } elseif(in_category(14)) /*si es una conversacion*/ { ?>
<div class="post conversacion">
<h2><a href="<?php the_permalink()?>" title="Enlace directo a este post"><?php the_ID()?></a></h2>
<?php dialog_styling()?>
</div>
<?php } else { ?>
<div class="post <?php $cat = get_the_category(); $cat = $cat[0]; echo $cat->category_nicename; ?>">
<h2><a href="<?php the_permalink()?>" title="Enlace directo a este post"><?php the_ID()?></a></h2>
<?php the_content()?>
</div>
<?php } ?>
<?php endwhile; endif; ?>
</div>
En palabras: si el post es una cita, su clase será class="post cita...
más una tercera clase que se define en relación al largo del post; si es una conversación, en vez de devolver el post, lo procesa a través de una función, y si no es de ninguno de los tipos anteriores, lo devuelve “normalmente”.
Seguramente esto se puede hacer mediante plugins (o, más bien, alguien podrÃa darse el trabajo de transformar esto en un plugin… ¿alguien dijo yo?)… y de paso, podrÃan revisar si esto tiene alguna deficiencia de seguridad u otra forma más efectiva de hacerlo, pero tal como está me ha funcionado sin problemas.
Calcular el largo de la cita
En el archivo functions.php
, defino la siguiente función:
function measure_quote() {
global $wpdb, $id;
$post = $wpdb->get_var("SELECT post_content FROM $wpdb->posts WHERE ID = $id");
$post_content = apply_filters ('the_content', $post);
$words = trim ( strip_tags($post_content) );
$word_count = count( explode(" ", $words) );
if ( $word_count > 120 ) {
print 'extra-large';
}
elseif ( $word_count > 80 ) {
print 'large';
}
elseif ( $word_count > 40 ) {
print 'medium';
}
else {
print 'short';
}
}
Y asà tenemos, por ejemplo, una cita corta, mediana, larga o extra-larga. Teniendo el largo de la cita como clase, el resto es puro CSS
Dar estilo a las conversaciones
Nuevamente, en functions.php
:
function dialog_styling() {
/* Gracias GelatoCMS...
http://www.gelatcocms.com
http://code.google.com/p/gelatocms/
bajo licencia GNU GPL 2
*/
global $wpdb, $id;
$post = $wpdb->get_var("SELECT post_content FROM $wpdb->posts WHERE ID = $id");
$formatedText = "";
$odd=true;
$lines = explode("\n", $post);
$formatedText .= "<dl>\n";
foreach ($lines as $line) {
$pos = strpos($line, ":") + 1;
$label = substr($line, 0, $pos);
$desc = substr($line, $pos, strlen($line));
if ($odd) {
$cssClass = "odd";
} else {
$cssClass = "even";
}
$odd=!$odd;
$formatedText .= " <dt class=\"".$cssClass."\">".$label."</dt>";
$formatedText .= " <dd class=\"".$cssClass."\">".$desc."</dd>\n";
}
$formatedText .= "</dl>\n";
echo $formatedText;
}
Como pone el código, he adaptado esta función del proyecto gelato, aprovechando su licencia GNU GPL 2 —que por cierto, también aplica a estos ejemplos.
Y… listo, tenemos nuestra conversación con estilo (o más bien, los estilos para nuestra conversación).
El gran final
Ok, quizás “el gran final” es mucho decir… en realidad, eso es todo. Como pueden ver a través de los ejemplos, aun me faltan muchos detalles (por ejemplo, arreglar algunas cosas que fallan en MSIE 6) para que mi WordPress-powered-tumblelog esté totalmente terminado, pero como pueden ver, con un poco de ingenio y ganas es posible hacerlo.
De todos modos, dejo disponible este archivo con lo que estoy utilizando hasta ahora — con licencia GNU General Public License, version 2.
Typographic – esbozo de un tema tipo tumblelog para WordPress
Asegúrense de cambiar todo lo necesario para que funcione en su propia instalación. No es necesario mantener un enlace de atribución, pero se apreciará y agradecerá; y si publican cualquier cosa basado en esto recuerden que debe ser bajo la misma licencia.