Las interfaces de usuario del futuro
Visto en Infotectura
Si trabajas con Wordpress, es más que posible que hayas necesitado crear una página (page.php), una plantilla para listar post (category.php) y/o una plantilla específica para mostrar las entradas de una categoría específica.
Por ejemplo: una página de contacto que tenga un diseño diferente al resto de las páginas estáticas de tu sitio, o una plantilla para mostrar las entradas de una determinada categoría (ejemplo para mostrar tu portfolio) de forma distinta a como se muestran las entradas del resto de categorías (por ejemplo el blog). Y por consecuencia con esta última, necesitas mostrar con diferentes plantillas las entradas individuales (single.php) de tu portfolio y las de tus entradas del blog.
Las dos primeras, wordpress te lo hace facilmente, para el último caso tendremos que crear un pequeño snippet. Vamos por partes:
1. Distintas plantillas para cada listado de post por categorías (category.php)
Esta es facil. Wordpress entiende que si creas una plantilla category-n.php, donde n es la id de la categoría que quieres mostrar de distinta forma, entonces esa es la plantilla que tiene que usar para listarla. Por ejemplo, si siguiendo el ejemplo anterior, queremos enseñar el listado de nuestros trabajos, que hemos categorizado con la categoría padre “portfolio” , de distinta forma a como mostramos el listado de post normales (blog), y la id de la categoría “portfolio” es 1, simplemente tenemos que crear un nuestro theme una plantilla llamada category-1.php donde estará la plantilla para mostrar el portfolio.
De esta manera tendremos una plantilla category.php que será la plantilla por defecto, y otra llamada category-1.php que será la que use wordpress ara mostrar los post de la categoría portfolio.
2. Distintas páginas estáticas ad hoc (page.php)
Esto aún es más sencillo. Wordpress usa page.php como plantilla por defecto para mostrar las páginas estáticas. Pero si creas una página estática llamana por ejemplo contacto comercial, y quieres que tenga una plantilla diferente, simplemente tienes que crear un template llamado como tu enlace permanente (si este fuera: www.tusitioweb/contacto), la plantilla se llamaría contacto.php, esto es, el nombre del permalink (http://tusitioweb/contacto).
3. Distintas plantillas para mostrar tus entradas individuales, dependiendo de la categoría (diferentes single.php para cada categoría).
En este caso Wordpress no nos ofrece ningún método mágico y tendremos que crear algo de código. Afortunadamente en google se encuentra todo. Veamoslo con un ejemplo.
Caso: queremos mostrar los detalles de nuestros trabajos (categoría padre portfolio) de distinta forma a cómo se muestran los post de nuestro blog (todas las demás categorías menos aquellas cuya categoría padre es portfolio).
El problema es que la categoría padre portfolio se subdivide en bastantes más categorías hijas y nietas (como por ejemplo: desarrollo web o diseño de interacción).
Solución: En la plantilla single.php, que es la encargada de mostrar las entradas individuales, preguntamos al loop cual es la categoría padre del post que queremos mostrar, ojo la categoría final, no la propia categoría del post, sino la de nivel superior. Si la categoría superior es la que queremos discriminar, le decimos que use una plantilla que hemso creado para ella y si no lo es, le decimos que use una plantilla single por defecto.
Vemoslo: Para empezar creamos las dos plantillas diferentes, por un lado la plantilla que va a mostrar las entradas pertenecientes a portfolio y la llamamos (como queramos pero por seguir un patrón) single-1.php (esto es con el -n donde n es la id de la categoría, para seguir un patrón reconocible y por semejanza a como se hace con las plantillas de listados de categorías o category.php). Por otro lado creamos una plantilla por defecto para mostrar el resto de las entradas que no caen en el caso anterior y la llamamos single-default.php. Y ya está prácticamente todo hecho, sólo tienes que crear el interruptor en php necesario en tu single.php (que es la plantilla a la que wordpress irá automáticamente cuando quiera mostrar una entrada individual). De esta manera basta con cortar y pegar el sguiente código, sustituyendo el nombre de la categoría por el tuyo:
1 2 3 4 5 6 7 8 9 10 | <?php if ( have_posts() ) { the_post(); rewind_posts(); } $category = get_the_category(); $parent = get_cat_name($category[0]->category_parent); if ( $parent=='el-nombre-de-tu-categoría' ) { include(TEMPLATEPATH . '/single-1.php'); } else { include(TEMPLATEPATH . '/single-default.php'); } ?> |
[También se puede hacer sin preguntar por la categoría padre, sino por las propias categorías (ver cómo), pero me parece que lo normal es que se haga siempre por una categoría padre, así que este código es un poco más sofisticado].
Y eso es todo. Cualquier cosilla que no me haya explicado bien, o cualquier errata, se agradece que se comente.
PD. Aquí no he hablado de cómo hacer plantillas, porque asumo que si llegas a este problema es que ya te desemvuelves con los themes de wordpress lo suficiente como para hacer temas sencillos para blogs. Y además se asume que tiene ya bien aprendida la jerarquía de plantillas de wordpress.
![]()
El diseñador gráfico tiene la intención de atraer una respuesta emocional visualmente. Mientras el diseñador de interfaces (de interacción) tiene la intención de provocar una repuesta lógica mentalmente.
Un buen artículo de Michael Dick donde explica de forma sencilla la diferencia entre diseñador gráfico y diseñador de interacción y repite algo que todavía muchos no han entendido: el diseño web no es diseño gráfico.
Lee el resto del artículo
Un snippet útil para poner un título en los comentarios de Wordpress con un excerpt del comentario.
Como Wordpress no tiene títulos para los comentarios, si un diseño lo exige, podemos falsearlo poniendo un excerpt del mismo. El problema es que comment_excerpt() te muestra las primeras 20 palabras del comentario, mucha tela para un titular.
Echando mano de esta misma función y modificándo sólo una línea podemos crear un comment_excerpt personalizado para usarlo a modo de titular, así por ejemplo la siguiente función muesta sólo las primeras 7 palabras:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | // comentarios con titulo exceeprt function custom_get_comment_excerpt() { global $comment; $comment_text = strip_tags($comment->comment_content); $blah = explode(' ', $comment_text); if (count($blah) > 7) { $k = 7; $use_dotdotdot = 1; } else { $k = count($blah); $use_dotdotdot = 0; } $excerpt = ''; for ($i=0; $i<$k; $i++) { $excerpt .= $blah[$i] . ' '; } $excerpt .= ($use_dotdotdot) ? '...' : ''; return apply_filters('get_comment_excerpt', $excerpt); } function custom_comment_excerpt() { echo apply_filters('custom_comment_excerpt', custom_get_comment_excerpt() ); } |
Lo guardas en tu functions.php en la raiz de tu tema y lo llamas desde la plantilla de la siguiente forma:
<?php custom_comment_excerpt(); ?>
Y listo, modificando sólo una línea de código y el nombre de la función.

Tras un año sin grandes eventos, como Fundamentos Web, The Evnt me parece bastante atractivo.
Sin megaestrellas extranjeras, los ponentes me parecen de lo más serio y profesional del panorama nacional, y además algunos de ellos han sido compañeros de trabajo, de asociaciones o de cervezas, y sin duda en persona te transmiten más cercanía saber hacer que cualquier gurú de allende los mares. Y además hablando español.

Los talleres y ponencias también están bastante interesantes. El programa es muy interesante y además es un evento muy económico (75€ dos días). Como bola extra, para quien no la conozca, Cáceres es una ciudad mediaval preciosa.
¿Quién se viene?
PD. La verdad es que todavía no he comprado la entrada, pq no estoy seguro de si voy a poder ir por asuntos de trabajo, pero vamos que me lo pienso esta noche y mañana lo decido.
Wordpress 3.0 está a punto de aterrizar esta primavera, y en este post nos enseñan 10 novedades interesantes, algunas son tonterías, pero otras son muy muy interesantes enfocadas en convertir wordpress en una verdadero CMS, como la integración de wp MU en el core, taxonomías mejoradas, etc y nos ahorrarán instalar plugins:
Échale un vistazo.