Creación de páginas de taxonomía dinámica con WordPress
Spanish (Español) translation by Andrea Jiménez (you can also view the original English article)
¿Alguna vez te preguntaste cómo puedes crear una biblioteca que sea tan flexible como el contenido que estás publicando? Hoy te explicaré cómo configuro páginas de taxonomía dinámica para los músicos en mi blog de música, pero puedes aplicar estas mismas técnicas en una variedad de formas diferentes. Este tutorial te muestra cómo puedes crear un registro dinámico para cualquier cosa sobre la que escribas.
Dirijo un gran sitio web de música. Para hacer un seguimiento de todas las veces que se mencionaron diferentes artistas y en qué contexto, quería crear una página para cada uno de ellos. Al crear nuevas taxonomías en WordPress, pude hacer esto simplemente etiquetando a una banda/artista en una publicación de WordPress. Además de esto, también podría crear dinámicamente enlaces de afiliados y dibujar contenido biográfico de un sitio como Last.FM.
Este tutorial te mostrará cómo configurar tu taxonomía, crear una plantilla para ella y luego implementar una generación dinámica de contenido y enlaces al artista en tu taxonomía en otro lugar de la web.
Paso 1 Configuración de las taxonomías personalizadas
Para comenzar, deberás agregar la función de taxonomías personalizadas a tu instalación de WordPress. Para hacer esto, simplemente abre tu archivo functions.php desde tu carpeta de temas, desplázate hasta el final y luego activa la función así:
1 |
/*
|
2 |
*Adds the custom taxonomy function to our functions.php file.
|
3 |
*/
|
4 |
add_action( 'init', 'build_taxonomies', 0 ); |
Una vez que hayas hecho eso, puedes comenzar a agregar las taxonomías que quieras. Para este tutorial, agregaremos una taxonomía de artistas que nos permitirá etiquetar bandas en publicaciones que escribamos y que WordPress saque una gran cantidad de información sobre esa banda o cantante sin que tengamos que hacer nada más. Dicho esto, avancemos y agreguemos la taxonomía 'Artista' justo debajo de la función de taxonomía que acabamos de agregar.
1 |
function build_taxonomies() { |
2 |
register_taxonomy( 'artist', 'post', //Let WordPress know that the artist taxonomy has posts |
3 |
array( |
4 |
'hierarchical' => false, |
5 |
'label' => 'Artists', // This tells WordPress how to label the various user interface outlets for the artist taxonomy |
6 |
'query_var' => true, |
7 |
'rewrite' => array( 'slug' => 'artist', 'with_front' => false )) |
8 |
);
|
9 |
}
|
No tienes que agregar una taxonomía de artista, puedes agregar la taxonomía que quieras. Solo lo estamos haciendo para los propósitos de este tutorial. Para obtener una lista completa de argumentos y opciones que puedes usar en la matriz, consulta el Codex y agrega o quita lo que quieras. Siempre y cuando te vayas en las partes que se comentan aquí, estarás bien.
Ahora abramos nuestro panel de administración de WordPress y escribamos una publicación. Ten en cuenta que se agregó un nuevo cuadro de 'Artista' tanto a tu menú de administración como a tus vistas de 'escribir publicación'. Esto significa que WordPress reconoció tu nueva función. ¡Brillante!


Una vez que hagas clic en 'Agregar' en el cuadro de la etiqueta del artista y presiones publicar, WordPress creará automáticamente un nuevo artista llamado 'Cualquiera que sea el nombre de tu banda'; para este tutorial, elegí usar una banda local llamada Kutosis.
Algunas personas dirán que podrías tener una página de categorías para hacer lo mismo. Tienen algo de razón, pero estamos a punto de encontrarnos con dos problemas si hacemos eso:
- Si escribimos sobre un buen número de bandas, nuestra instalación de WordPress se complicará mucho pronto si creamos una categoría para cada banda.
- Si queremos incluir contenido creado dinámicamente para cada artista, estaremos nadando en código innecesario.
El uso de taxonomías personalizadas nos ayuda a evitar estos problemas y permite realmente la escalabilidad en nuestro sitio web. También significa que al proporcionar una etiqueta de artista, podemos hacer muchas cosas geniales con llamadas API a sitios web de música.
Pero antes de entusiasmarnos con todas las posibilidades, debemos averiguar cómo mostrar la información en nuestra página.
Paso 2 Configuración de nuestra plantilla single.php
Ya que especificamos que nuestra publicación contiene referencias a una determinada banda/artista, necesitamos una forma de indicárselo a los lectores de la publicación. La forma de hacerlo es agregar un par de líneas simples de código para mostrar enlaces a todos los artistas de los que hemos hablado al archivo single.php que WordPress usa para mostrar publicaciones individuales.


¿Ves el enlace? Justo donde dice 'En esta publicación', ese enlace se logra agregando el siguiente código a nuestro archivo single.php. Elegí agregarlo justo encima de la parte de mi plantilla que llama a la plantilla de comentarios:
1 |
<?php
|
2 |
// We need to tell WordPress to look for our custom taxonomy lists
|
3 |
|
4 |
$taxo_text = ""; |
5 |
|
6 |
// Then we need to tell it which one we want in particular and store it for use in our code.
|
7 |
|
8 |
$artist_list = get_the_term_list( $post->ID, 'artist', '<strong>In this post:</strong> ', ', ', '' ); |
9 |
if ( '' != $artist_list ) { |
10 |
$taxo_text .= "$artist_list<br />\n"; |
11 |
}
|
12 |
|
13 |
// Now we need to tell Wordpress exactly how we want to display the tag
|
14 |
|
15 |
if ( '' != $taxo_text ) { |
16 |
?>
|
17 |
<div class="entry-utility"> |
18 |
<?php
|
19 |
echo $taxo_text; |
20 |
?>
|
21 |
</div>
|
22 |
// This just let's WordPress know that there's an else argument. It will remove the 'In this post' if no artists have been tagged. |
23 |
<?
|
24 |
}
|
25 |
?>
|
26 |
|
27 |
// You don't need the following line. I have left it here to show you where I placed my code. |
28 |
<?php comments_template( '', true ); ?> |
Esta sección de código le dice a WordPress que haga algunas cosas:
- Le dice a WordPress que busque cualquier etiqueta que esté asociada con la publicación.
- Luego especifica que estamos interesados en la etiqueta de Artista
- Después de eso, le dice a Wordpress cómo queremos mostrarlo si está allí y cómo no mostrar nada si no hay una etiqueta asociada con la publicación.
Paso 3 Creación de una plantilla de taxonomía
Así que ahora tenemos una forma de vincularnos a una página de archivo que muestra todas las publicaciones asociadas con el artista etiquetado en la publicación; podríamos detenernos allí, pero hay mucho más que podemos obtener de estas poderosas taxonomías pequeñas. Por ejemplo, ¿qué pasa si queremos monetizar nuestro blog y configurar enlaces de afiliados para comprar la música del artista en iTunes o simplemente dejar que nuestros lectores disfruten de nuestra escritura con algunas canciones de Spotify del artista en cuestión? O incluso mejor: si tenemos lectores curiosos, podríamos permitirles leer un poco sobre el artista etiquetado en la publicación y nunca tener que escribir una palabra nosotros mismos. Emocionante ¿verdad?
En lugar de agregarle carga y montones de código condicional a nuestra plantilla de archivo y hacerlo ridículamente largo, aprovechemos al máximo la jerarquía de plantillas de WordPress. Agregaremos un archivo llamado taxonomy-artist.php que es casi el primer nombre de archivo que WordPress buscará para formatear nuestra información. Para obtener más información sobre las jerarquías de plantillas de WordPress, dirígete al Codex de WordPress.
Duplica el archivo archive/category.php de tu tema y cámbiale el nombre a taxonomy-artist.php (o si decidiste crear una taxonomía diferente, cambia el artista por el nombre de tu taxonomía) para que puedas mantener fácilmente la estructura de tu plantilla. Una vez que hayas duplicado los archivos template/category.php, ahora debes eliminar tu nuevo archivo taxonomy-artist.php de todo el código que no sea el básico de tu estructura. No te preocupes, lo agregaremos todo a medida que avancemos.
Una vez que guardes, te quedarás con una estructura básica como esta:


Habiendo eliminado todo el código que no necesitábamos, introduzcamos todo el código que sí necesitamos. Comenzando desde la parte superior, justo debajo del encabezado de nuestra página, agregaremos lo que quizás sea el código más vital y más corto y se ve así:
1 |
<?php
|
2 |
// This sets out a variable called $term - we'll use it ALOT for what we're about to do.
|
3 |
$term = get_term_by( 'slug', get_query_var( 'term' ), get_query_var( 'taxonomy' ) ); ?> |
Lo que hace esa pequeña belleza es darnos una variable llamada $term para todo lo que estamos a punto de hacer. $term será el nombre de nuestra taxonomía. Para nuestro ejemplo, WordPress usará la banda Kutosis porque ese es el acto que etiqueté en mi publicación.
Luego podemos usarlo en nuestra plantilla para agregar un título de taxonomía
1 |
<!-- See how we used the variable to let Wordpress know we want to display the title of the taxonomy? -->
|
2 |
<h2><?php echo $term->name; ?></h2> |
También podemos usarlo para mostrar una lista de publicaciones que han hecho referencia al artista en todo nuestro sitio. Nota: Tendrás que etiquetar la publicación tú mismo porque WordPress no adivinará por ti.
1 |
<!-- Using the same variable, we can use it to display the posts that the artist has been tagged in -->
|
2 |
<h2><?php echo $term->name; ?> elsewhere on the site</h2> |
3 |
<ul class="artistappearances"> |
4 |
<?php while (have_posts()) : the_post(); ?> |
5 |
<li><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a> - <?php the_time('d M Y'); ?></li> |
6 |
<?php endwhile; ?> |
7 |
</ul>
|
Paso 4 ¡Es hora de la API!
Habiendo hecho todo eso, tenemos algo como esto:


No parece demasiado impresionante, ¿verdad? ¡Eso es porque estamos a punto de subir el volumen de la página de esta banda! Comencemos agregando algunos enlaces al artista en la web para brindarle un valor agregado a nuestros lectores.
1 |
<!-- Let's add some links to show people where else they can find the artist on the web -->
|
2 |
<a href="http://www.last.fm/music/<?php echo $term->name; ?>" target="_blank">Last FM</a> | |
3 |
<a href="http://phobos.apple.com/WebObjects/MZSearch.woa/wa/search?term=<?php echo $term->name; ?>&type=artistName&partnerId=YOUR iTUNES AFFILIATE ID HERE">Buy Music</a> | |
4 |
<a href="spotify:search:<?php echo $term->name; ?>">Spotify</a> |
Estas tres líneas de código son ejemplos de lugares a los que quizás quieras vincularte. Agregué un enlace de Last.FM, Spotify e iTunes. Con el enlace de iTunes, si estás registrado en el programa de afiliados, puedes agregar tu ID de socio en la URL; si no eres miembro, no te preocupes, simplemente sácalo.
Como dije, estos son solo ejemplos de lugares a los que podrías vincularte. En cualquier lugar donde quieras agregarle un enlace al artista en la web, simplemente averigua cómo están estructurados los enlaces permanentes a ese sitio y de dónde viene el nombre del artista. Luego, simplemente coloca la variable que configuramos en la URL como lo hice en el código anterior.
La otra gran ventaja de esto es que incluso si el artista tiene espacios en su nombre, la mayoría de los sitios podrán interpretar eso de manera agradable y asegurarse de que se te dirija al lugar correcto. Simplemente pruébalo y mira qué sucede. Así es como se ve nuestra página.


Ahora usemos una API
Hasta ahora, acabamos de hacer que nuestros enlaces sean dinámicos. ¿Qué pasa si queremos agregar algo más de valor para nuestros lectores y darles una descripción general rápida del artista sobre el que hemos estado escribiendo?
La API de Last.FM nos permite el acceso completo a su enorme biblioteca de información musical. Esta API es probablemente una de las mejores que existen, ¡tenemos suerte! Tomemos la biografía del artista de la base de datos de Last.FM.
Si aún no tienes una clave API Last.FM, deberás registrarte para obtener una haciendo clic aquí antes de continuar en este tutorial.
Una vez que tengas tu clave API Last.FM, abre tu archivo taxonomy-artist.php y decide dónde quieres colocar la biografía. Luego, revisa la documentación en el sitio web de Last.FM para ver que la estructura de la llamada API para artist.getInfo es la siguiente: http://ws.audioscrobbler.com/2.0/?method=artist.getinfo&artist=cher&api_key= yourapikeynumber.
A menos que quieras información sobre la carrera musical de Cher en cada página de artista en tu sitio web, deberás cambiar algunas cosas en la URL. Elimina Cher y reemplázalo con nuestra variable de artista para que tengas esto:
1 |
http://ws.audioscrobbler.com/2.0/?method=artist.getinfo&artist=".$term->name."&api_key=YOUR_API_KEY |
Esa es la estructura de llamadas a la API que usaremos, pero desafortunadamente, no es tan sencillo como pegarla en un archivo de plantilla y dejar que WordPress funcione con sus dígitos mágicos. Tendremos que buscar una manera de decirle a la página exactamente qué parte de la información del artista estamos necesitando. Sin embargo, antes de adelantarnos a nosotros mismos, debemos configurar una función cURL para obtener la información de Last.FM.
CURL no es la única forma de hacer esto, pero la mayoría de los servidores web se molestarán contigo si activas las otras funciones como fopen en tu archivo PHP.ini porque podría representar un riesgo de seguridad. Para evitar vergonzosos mensajes de error cuando tu servidor web te descubre usando un método non grata, es mejor optar por lo siguiente:
1 |
<!-- Here's where we're going to print information about our artist -->
|
2 |
<?php
|
3 |
//Tell our page where we're going to make the call to
|
4 |
$request_url = "http://ws.audioscrobbler.com/2.0/?method=artist.getinfo&artist=".$term->name."&api_key=YOUR_API_KEY"; |
5 |
//Begin our curl resource
|
6 |
$ch = curl_init($request_url); |
7 |
//Put all the stuff from the page we called into a string
|
8 |
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); |
9 |
// Put that info into a nice output
|
10 |
$output = curl_exec($ch); |
11 |
// Sort out our memory
|
12 |
curl_close($ch); |
13 |
?>
|
Esta es una función CURL estándar. Solicita el archivo Last.FM para nuestro artista, lo imprimes en un recurso de rizo y luego lo produce muy bien antes de cerrarse.
Pero, por supuesto, todavía no le hemos dicho dónde queremos que vaya la descripción del artista o exactamente cómo encontrar la descripción. Hagámoslo usando SimpleXML.
1 |
<!-- Here's where we're going to print information about our artist -->
|
2 |
<?php
|
3 |
//Tell our page where we're going to make the call to
|
4 |
$request_url = "http://ws.audioscrobbler.com/2.0/?method=artist.getinfo&artist=".$term->name."&api_key=YOUR_API_KEY"; |
5 |
//Begin our curl resource
|
6 |
$ch = curl_init($request_url); |
7 |
//Put all the stuff from the page we called into a string
|
8 |
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); |
9 |
// Put that info into a nice output
|
10 |
$output = curl_exec($ch); |
11 |
// Sort out our memory
|
12 |
curl_close($ch); |
13 |
|
14 |
//IMPORTANT: This is where we begin to tell how we want the output displayed
|
15 |
$xml = simplexml_load_string($output); |
16 |
//Here's where we tell the page the specific place that we want it to print information from
|
17 |
$info = $xml->artist->bio->summary; |
18 |
?>
|
19 |
<!-- Let's tell WordPress that we want to display that information here -->
|
20 |
<?php echo $info ?> |
No queremos todo en el archivo XML, solo queremos obtener el resumen del artista que contiene una versión corta de la biografía. Eso es lo que hace este bit: $info = $xml->artist->bio->summary;
Luego, el resumen se le asigna a una variable llamada $info que podemos hacer eco en cualquier lugar de nuestra página de plantilla dejándonos con algo que se ve así:


Conclusión
¡Felicidades! ¡Hiciste una página de artista generada dinámicamente para tu banda favorita!
Puedes hacer todo tipo de cosas geniales con la API de Last.FM, incluida la extracción de enlaces a las 5 mejores pistas escuchadas por un artista, imágenes biográficas, entre otros. Lo mejor que puedes hacer es jugar con las llamadas a la API que puedes hacer.
Si prefieres manejar las imágenes biográficas tú mismo, existen algunos plugins excelentes. Lo más notable es el plugin Taxonomy Images de Michael Fields, que tiene una forma sencilla de agregar imágenes personalizadas a tu taxonomía sin ningún tipo de codificación. Si eliges usar ese plugin, consulta las preguntas frecuentes de Michael para obtener una documentación realmente buena sobre cómo usarlo según tus necesidades.



