Crear sidebars en WordPress

Web Hosting
Creando manualmente nuestras sidebars nos permitirá añadir o quitar widgets desde el panel de administración y ordenarlos según queramos. Aparte también hace que podamos establecer qué id’s o clases de CSS queremos para la sidebar y así poder darle estilos. Para ello hay que realizar dos pasos: registrarla en el functions.php y crear un archivo sidebar.php o sidebar-id.php.

Registrar la sidebar en el functions.php

Abriremos nuestro fichero de funciones del template que estemos usando y añadimos el siguiente código:

if(function_exists('register_sidebar')) {
    register_sidebar(array(
        'name'          => 'Sidebar general',
        'id'            => 'general',
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget'  => '</aside>',
        'before_title'  => '<h3>',
        'after_title'   => '</h3>',
    ));
}

Básicamente lo que hacemos es registrar una sidebar con el nombre Sidebar general (es el que saldrá en el panel de administración) y con un id (que también se usa como id de CSS) “general”.

Consigue por solo 10€ mi
curso profesional de WordPress

Los dos siguientes parámetros que le pasamos a la función sirven para determinar que tipo de tag html queremos que contenga cada uno de los widgets. En este caso usamos <aside> que es el que se usa en HTML5. Si no estás seguro de usarlo recomiendo como alternativa usar la etiqueta <div>. Si no le especificamos ningún inicio ni cierre del widget WordPress usará las etiquetas <li>.

Los dos últimos parámetros indican con qué etiquetas queremos que se usen en los títulos de los widgets. Por defecto WordPress pone etiquetas <h2>.

Crear un fichero sidebar.php o sidebar-id.php

Al definir una nueva sidebar en nuestro template WordPress irá a buscar un fichero sidebar.php que es el que llamará a la sidebar dinámica. La documentación de WordPress dice que si no encuentra este fichero cargará el que está en wp-includes/theme-compat/sidebar.php. Pues el caso es que cuando no encuentra el fichero nos sale el siguiente Notice en la web: Notice: Tema sin sidebar.php está obsoleto desde la versión 3.0 y no hay alternativas disponibles. Por favor, incluye la plantilla sidebar.php en tu tema. Mirándome el fichero que WordPress incluye cuando no encuentra el sidebar.php aparece la siguiente info en la cabecera:

/**
 * @package WordPress
 * @subpackage Theme_Compat
 * @deprecated 3.0
 *
 * This file is here for Backwards compatibility with old themes and will be removed in a future version
 *
 */

Esto quiere decir que en futuras versiones de WordPress este fichero dejará de existir. Por lo tanto si no tenemos este fichero nos quedaremos sin sidebar. Así que habrá que crearlo:

<div id="sidebar" role="complementary">
  <?php if (!dynamic_sidebar('general')); ?>
</div>

Con estas tres líneas ya estamos llamando al contenido (los widgets) de nuestra sidebar dinámica general. Lo que hace esta función es llamar a cada uno de los widgets que contiene la sidebar y los printa allí donde la habremos llamado. Devolverá TRUE si la función se ha ejecutado correctamente (si tiene widgets) y FALSE si no.

Si da FALSE lógicamente se ejecutará el código que haya dentro del if, así que para asegurarnos que siempre se mostrará algo estaría bien poner un par de widgets “estáticos”. Veréis que en la documentación de la función dynamic_sidebar() se recomienda crear estos tipos de widgets.

Si necesitáis dos o más plantillas de sidebars, por lo que sea, habría que crear el fichero sidebar-general.php. Así cuando llaméis a la sidebar “general” WordPress usará este fichero. En caso contrario usará la plantilla normal sidebar.php

Mostrar la sidebar

Para mostrar la sidebar solo tendremos que llamar a la función get_sidebar($nombre) allí donde queramos que la sidebar se muestre. El parámetro $nombre indica el “id” de la sidebar que queremos mostrar (en nuestro caso “general”). Si no se especifica se muestra los widgets “estáticos” que he explicado más arriba.

6 opiniones en “Crear sidebars en WordPress”

  1. Muy buen post. Justamente estaba buscando algo asi. Tengo el theme clasipress y queria ver de agregar un sidebar a la derecha para poder colocar publicidad.
    Gracias por compartir

Deja un comentario