El sidebar en WordPress

Wordpress

El sidebar es la barra lateral que aparece en un lado en la página web. Están destinadas para separar el contenido principal del secundario. Pueden contener una navegación alternativa, contenido secundario, pequeños formularios, texto descriptivo, anuncios, imágenes…

Para mostrar el sidebar basta con añadir la siguiente etiqueta de plantilla

PHP
1
<?php get_sidebar(); ?>

Esa función obtendrá el contenido del sidebar.php y lo pondrá en el lugar donde la función fue llamada. Y en caso de trabajar con varios sidebars?

PHP
1
<?php get_sidebar('secundario'); ?>

En esta ocasión la función obtendrá el contenido del archivo sidebar-secundario.php y lo cargará.

Obviamente esta barra es completamente opcional, basta con no poner esa función si no quieres que aparezca.

Funciones

Tienes a disposición una serie de funciones con las que podrás sacar partido al sidebar y organizar mejor el contenido de tu sitio. Hablaré de las mas populares.

Listado de post recientes

Si por ejemplo un usuario está viendo un post en concreto, pero quieres que vea los últimos 10 post publicados, esta función te será útil.

PHP
1
2
3
4
5
6
7
8
<?php
   wp_get_archives(array(
'type' => 'postbypost', //Tipo de lista. En caso en orden de fecha
'limit' => 10, //Cuantos
'format' => 'html', //Este formato devolverá los post dentro de un <li> cada uno
'show_post_count' => false //No mostrar cuantos posts
   ));
?>

Esto mostrará sólo los títulos de los posts, no mostraría ningún extracto.

Nube de etiquetas

Una nube de etiquetas o tag cloud es ideal si quieres que los usuarios naveguen en tu sitio siguiendo una taxonomía en concreto.

PHP
1
2
3
4
5
6
7
8
9
10
11
12
<?php
  wp_tag_cloud(array(
'smallest' => 10, //Tamaño mínimo de la etiqueta
'largest' => 18, //Tamaño mínimo de la etiqueta
'unit' => 'px', //Unidad de tamaño para el mínimo y máximo
'orderby' => 'name', //Orden alfabéticamente
'order' => 'ASC', //Orden ascendente
'exclude' => 6, //Etiquetas o categorías con el term_id 6 no se muestran
         'taxonomy' => array( 'post_tag', 'category' ), //La nube se compone de etiquetas de post y
         //categorías. Si tienes una taxonomía personalizada puedes insertar su nombre para obtener
         //sus etiquetas
)); ?>

Si deseas saber como crear una taxonomía en WordPress o quieres saber como funcionan te recomiendo este post.

Listado de categorías

Las categorías pueden ser el principal medio de navegación (como esta web) pero también pueder ser un medio secundario a incorporar en la barra lateral.

PHP
1
2
3
4
5
6
7
8
9
10
<?php
  wp_list_categories(array(
'orderby' => 'name', //Orden alfabétio
'order' => 'ASC', // Ascendente
'show_count' => 0, // No mostrar la cantidad
'title_li' => __('Categorias'), //Titulo que recibe el elemento <li>
'exclude' => 12, // ID de la categoría que no se quiere mostrar
'depth' => 0  //Niveles a bajar en el árbol de categorías si se quieren
         //meter también ciertas subcategorías
)); ?>

Mostrar el blogroll

El blogroll es un conjunto de enlaces a otras webs que se recomiendan a los visitantes del sitio, ya sea porque hay buenos artículos o a cambio de que el otro blog te promocione. Desde la versión 3.5 de WordPress el gestor de enlaces que se encargaba del blogroll ya no está y tendrías que instalar este plugin para activarlo.

PHP
1
2
3
4
5
6
7
8
9
<?php
   wp_list_bookmarks(array(
'orderby' => 'name', //Orden alfabético
'order' => 'ASC', //Ascendente
'limit' => -1, //Muestra todos los enlaces
'title_li' => __('blogroll'), // Título del <li>
'title_before' => '<h2>', //Que hay antes del enlace
'title_after' => '</h2>', // Que hay después del enlace
)); ?>

Widgets

Los Widgets permiten añadir funcionalidad extra en tu página web, y es común situarlos en la barra lateral y puedes gestionarlos desde el área de adminsitración. Si quieres que el sidebar tenga widgets escribe el siguiente código en el sidebar.php

XHTML
1
2
3
4
5
6
7
<div id="sidebar">
   <ul>
       <?php if (!function_exists('dynamic_sidebar') || !dynamic_sidebar()) : ?>
      
       <?php endif; ?>
</ul>
</div>

La función dynamic_sidebar() se encarga de llamar los widgets que estén activos. Ahora en functions.php debes de crear el sidebar, coloca este trozo de código.

1
2
3
4
5
6
7
8
if (function_exists('register_sidebar')) {
register_sidebar(array(
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>',
'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h2>',
));
}

Esto creará el listado de widgets. Cada widget estrará entre <li> y el título entre <h2>.

Y hasta aquí el tutorial de hoy, espero que os haya gustado. A seguir picando 🙂