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
/*
Template Name: Nube de Tags
*/
?>

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
/*
Template Name: Nube de Tags
*/
?>
< ?php get_header(); ?>
<div id=“content” class=“narrowcolumn”>
</div>
< ?php get_sidebar(); ?>
< ?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
/*
Template Name: Nube de Tags
*/
?>
< ?php get_header(); ?>
<div id=“content” class=“narrowcolumn”>
<div class=“nube”>
< ?php wp_tag_cloud(‘number=0′); ?>
</div>
</div>
< ?php get_sidebar(); ?>
< ?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.

¿Te gustó este post? ¡Compártelo!
  • Bitacoras.com
  • TwitThis
  • Facebook
  • Meneame
  • Google Bookmarks
  • del.icio.us
  • Live
  • Technorati
  • Ping.fm
  • Wikio
  • Turn this article into a PDF!
  • E-mail this story to a friend!
  • Print this article!

También te puede interesar:

cursos formación continua

    4 comentarios en “Como hacer una página con Nube de Tags”

  1. todotuto (34 comentarios) dijo:

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

  2. 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 (1845 comentarios) dijo:

    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 ;)

  4. Otra opción más sencilla es usar un plugin del estilo exec-php y crear una página nueva. Insertar el código en el contenido y listos.

    Yo últimamente estoy pensando en reestructurar el blog y una de las cosas es crear una página para categorías y otra para tags. Pero por más que pruebo de configurar el tag cloud con ayuda del codex de wordpress no consigo que los tags aparezcan como una nube de tags, sino que siempre me aparecen en forma de lista…

    ¿Sabes cual puede ser la solución?

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>



Subir

Expertos en WordPress
Euribor
Hardware. Software. Ocio & Multimedia. Humor. Internet. Videojuegos.Noticias
Participa en el Debate
  • carlos: He movido un blog de Blogger a Wordpress con hosting propio. He seguido el tutorial, que...
  • Jh®: Windows Live Writer… ese es el que uso!
  • Dark_Tairon: espero con ansias que digas que tal funcion para actulizar mi instalacion, por...
  • lander: tengo un problema , luego de instalar el plug in en wp y configurar las opciones de las...
  • Hades87: @ferticidio pero le peudes deshabilitar el estilo desde el mismo WLW y se e bien, yo es...
Noticias Breves
  • Si quieres aprender como hacer multitud de diseños distintos para WordPress no te pierdas esta estupenda recopilación de 26 tutoriales de diseño de blogs WordPress.

    [#3]

  • Acaba de salir a la luz la nueva versión de WordPress para iPhone 1.3, con soporte completo para el firmware de iPhone 3.0. Va de cojones estupendamente. Altamente recomendable esta actualización, que tienes en iTunes.

    [#1]

  • Me avisa Kike Alonso de un nuevo plugin que permite que los comentarios que dejen tus amigos de Friendfeed al respecto de un post de tu sitio WordPress aparezcan también en tu post como comentarios normales, algo realmente interesante pues permite, con algunos clientes de escritorio e iPhone, comentar en blogs sin dejar de usar la aplicación de mensajería.

    [#6]


  • Ahora mismo en los FOROS ...
    Usuarios Registrados
  • Acceder

  • Translate this Blog
    Spanish flagItalian flagChinese (Simplified) flagPortuguese flagEnglish flagGerman flagFrench flagJapanese flagRussian flagSwedish flagCatalan flagHebrew flag                              
    By N2H