Entre Blogs Portal

Publicado por Fernando Tellado | 20 Mayo 2008

Como hacer una página con Nube de Tags

Seguramente habrás observado que hay muchos blogs con una nube de tags en la barra lateral, este mismo dispone de una para facilitar la navegación por las mismas. Ahora bien, hay ocasiones en que, bien por acumulación de elementos en la barra lateral, bien por diseño o incluso porque tengas muchas tags es mejor sacar la nube de tags de la barra lateral y ofrecerle un espacio propio, su propia página y luego enlazarla desde la barra de navegación de tu blog o desde donde quieras.

Vamos a ver como se hace, es muuuuuy fácil crear una página de nube de tags.

1. Crear la plantilla de página

Lo primero que tenemos que hacer es crear una plantilla personalizada de página. No es nada del otro mundo, y como hemos explicado en otras ocasiones, pasa por añadir unos comandos PHP al comienzo del fichero.

Nos lanzamos y creamos un nuevo archivo php y le llamamos “nube.php” (o como mas te guste a ti. Al principio de todo del archivo incluimos lo siguiente:

PHP:
  1. <?php
  2. /*
  3. Template Name: Nube de Tags
  4. */
  5. ?>

Con esto le estamos diciendo a WordPress que nuestro archivo nube.php es la plantilla de página cuya denominación será "Nube de Tags".

2. La Estructura Básica

A continuación debemos añadir la estructura básica a la página, incluyendo la cabecera, barra/s lateral/es, pié de página, etc. Para no complicarte lo mejor es revisar la estructura de cualquier otra plantilla de página, como "page.php" para saber lo que tienes que añadir a tu plantilla de página nueva y que encaje perfectamente en tu theme actual. En Kubrick, uno de los themes mas conocidos sería así:

PHP:
  1. <?php
  2. /*
  3. Template Name: Nube de Tags
  4. */
  5. ?>
  6. <?php get_header(); ?>
  7. <div id=“content” class=“narrowcolumn”>
  8. </div>
  9. <?php get_sidebar(); ?>
  10. <?php get_footer(); ?>

Eso si, áun no veríamos la nube de tags con este código porque nos falta lo principal, la etiqueta php que llama a la nube de tags. Ya llegamos.

3. La Etiqueta de Nube de Tags

Bueno, pues ya es momento de incluir la etiqueta php que nos mostrará la nube de tags: wp_tag_cloud() Si quieres saber mas acerca del usuo de esta etiqueta puedes revisar el codex, la referencia oficial.

Venga, vamos a añadir la etiqueta a nuestra plantilla de página:

PHP:
  1. <?php
  2. /*
  3. Template Name: Nube de Tags
  4. */
  5. ?>
  6. <?php get_header(); ?>
  7. <div id=“content” class=“narrowcolumn”>
  8. <div class=“nube”>
  9. <?php wp_tag_cloud(‘number=0); ?>
  10. </div>
  11. </div>
  12. <?php get_sidebar(); ?>
  13. <?php get_footer(); ?>

Fíjate que hemos introducido el modificador “number=0”, esto es debido a que, por defecdto, la etiqueta wp_tag_cloud() solo muestra las 45 tags mas utilizadas, y como tenemos espacio de sobra vamos a permitir que se muestren todas, que para eso tiene su página propia.

Además, es imporante, como en el ejemplo, insertar la etiqueta dentro de un div, que llamaremos "nube" por si luego queremos cambiar su aspecto por medio de alguna clase CSS.

Con esto hemos terminado de tocar código PHP, ahora solo queda guardar nuestro archivo nube.php y subirlo a la carpeta de tu theme.

4. Crear una página nueva

Como ya tenemos nuestra plantilla ahora solo nos queda crear una página utilizándola. Lo haremos así:

  1. Vas a la sección Escribir » Página en el panel de admin.
  2. Le pones un nombre descriptivo en el campo de Título.
  3. Eliges la Plantilla de Página (a la derecha hasta WP 2.5 y abajo a partir de esta versión) y eliges en el desplegable la ¡sorpresa! plantilla llamada "Nube de Tags", si, la que tu has creado.
  4. No escribes nada en el campo de texto y le das a Publicar.

Y ya lo tienes, estará disponible desde la barra de navegación de páginas estáticas de tu blog (si la tienes) o desde donde quieras enlazarla.

También te puede interesar:

3 comentarios | Escribe un comentario

  1. todotuto (25 comentarios) - 20/05/2008 a las 16:16

    Muy bueno el tuto, Fernando, más claro agua :D

  2. David Delgado (2 comentarios) - 18/07/2008 a las 20:08

    Muy bueno el tutorial. He seguido todos los pasos (eso creo), pero al pinchar en una etiqueta solo me sale la última entrada bajo dicha etiqueta. ¿cómo puedo hacer para que me salgan todas?
    Aquí está la página creada con tu tutorial http://www.fotosdaviddelgado.ddoble.es/fotos-por-palabras

    Felicidades por el blog y seguid así.

    Saludos

  3. Fernando Tellado (1067 comentarios) - 18/07/2008 a las 20:31

    David, mas parece una característica de tu plantilla, porque he visto que en la página de inicio también te muestra solo un post. Veo en el pié de página que la has hecho tu ¿es así?

    No se decirte así al vuelo, habría que ver tu código en detalle, si te parece pásate por el foro y lo vemos ;)

Escribe un comentario




XHTML: Puedes usar estas etiquetas: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

RSS

¿Que es RSS?
Si te gusta este blog vótanos en las categorías BLOG TECNOLÓGICO y BLOG REVELACIÓN

LO ÚLTIMO EN LOS FOROS

Cargando...