sidebar widgets

Sidebar diferente para cada página en WordPress

En algunas ocasiones podemos necesitar tener un sidebar o barra lateral diferente para cada página o sección de nuestro sitio. Esto es muy habitual si tienes un desarrollo a medida y unas funcionalidades específicas. Esto lo podemos hacer de 3 formas diferentes:

  • Con un único archivo sidebar.php en el que estableceremos una serie de condicionales para lanzar el código que deseemos en función de la plantilla en la que estamos.
  • Utilizando diferentes archivos sidebar.php siguiendo la regla sidebar-{nombre}.php, que cargaremos desde las plantillas del tema.
  • Utilizando áreas de Widgets distintas en cada página.

Un único archivo sidebar.php para todas las páginas

Para cargar el archivo sidebar.php desde cualquiera de las plantillas de nuestro tema usaremos la función get_sidebar(). Utilizando los condicionales de WordPress (is_home(), is_page(), is_single(), is_category()… más información aquí) podremos saber en qué plantilla estamos y lanzar el código que deseemos, por ejemplo:

<div id="sidebar">
   <?php if ( is_home() ){
       // Código para la página de Inicio
   }

   if ( is_page() ){
       // Código para las páginas
   }

   if ( is_single() ){
       // Código para los detalles de las entradas
   }

   if ( is_page_template('contacto') ){
       // Código si tenemos una plantilla de página "contacto"
   }?>
</div>

Cómo podemos observar, usando los condicionales de WordPress podremos definir qué código mostrar en función de si estamos en una página, en una categoría, en una etiqueta, en la página de búsqueda, incluso definir una barra lateral específica para una categoría o página concreta, etc…

El plugin de ecommerce más fácil de usar para WordPress

Diferentes archivos sidebar-{nombre}.php

La barra lateral por defecto es el archivo sidebar.php y lo llamamos con la función get_sidebar(), pero podemos crear tantos archivos como queramos siguiendo la nomenclatura sidebar-{nombre}.php. Es decir, imaginando que tenemos una página especial para Eventos, y queremos crear una barra lateral específica para esa página, bastaría con crear el archivo sidebar-eventos.php y llamarlo desde la plantilla eventos de la siguiente manera:

<?php get_sidebar( 'eventos' );?>

Ahora en el archivo sidebar-eventos.php podremos definir el código que queramos mostrar en la barra lateral de la página eventos.

Utilizar áreas de widgets diferentes

Podemos crear tantas áreas de widgets como necesitemos utilizando la función register_sidebar() en nuestro fichero functions.php:

<?php
register_sidebar(
   array(
       'name' => 'Widgets Home',
       'id' => 'widgets-home',
       'description' => 'Área de widgets que aparece en la Home',
       'class' => '',
       'before_widget' => '<div class="widget-home">',
       'after_widget' => '</div>',
       'before_title' => '<h2>',
       'after_title' => '</h2>'
   )
);

register_sidebar(
   array(
       'name' => 'Widgets Default',
       'id' => 'widgets-default',
       'description' => 'Área de widgets que aparece en el sidebar por defecto',
       'class' => '',
       'before_widget' => '<div class="widget-default">',
       'after_widget' => '</div>',
       'before_title' => '<h3>',
       'after_title' => '</h3>'
   )
);

register_sidebar(
   array(
       'name' => 'Widgets Eventos',
       'id' => 'widgets-event',
       'description' => 'Área de widgets que aparece en el sidebar de los eventos',
       'class' => '',
       'before_widget' => '<div class="widget-event">',
       'after_widget' => '</div>',
       'before_title' => '<h2>',
       'after_title' => '</h2>'
   )
);

Éste código nos generará 3 áreas de widgets distintas donde podremos incluir widgets diferentes para cada una de ellas:

areas widgets

Ahora podremos llamar a estas áreas de widgets desde cualquiera de nuestros archivos sidebar-{nombre}.php de la siguiente manera:

<?php

if ( is_active_sidebar( 'ID-area-widget' ) ) {
    dynamic_sidebar( 'ID-area-widget' );
}

Donde ID-area-widget será el ID que hemos establecido al registrar el sidebar.

¿Te ha resultado útil esta información? 🍺

Si este post te ha resuelto un problema, invítame a un café o a una cerveza. Con este pequeño gesto me animas a seguir escribiendo.

Comentarios

5 comentarios en Sidebar diferente para cada página en WordPress

  1. Buenas tardes, muchas gracias por la infor, pero tengo una consulta digamos que tengo un plugin (ejemplo: job manager) y este plugin hace que se carge todos los puestos de trabajo(jobs) que existen, pero al entrar al detalle de un trabajo me carga el sidebar por defecto, como podria hacer para cambiar el sidebar de esa pagina automaticamente creada por el plugin. Gracias de antemano.

    1. Hola Otto

      No conozco ese plugin, pero imagino que creará un CPT llamado «job» o algo similar. Si dispones de una página para mostrar el detalle de este CPT (ej: single-job.php), en esa plantilla llama al sidebar que necesites

      Saludos

      1. EL PROBLEMA ESTA EN QUE TENGO POR DEFECTO UN SIDEBAR(UTIL PARA LA TIENDA SHOP), Y APARECE CADA QUE UN PLUGIN CREA UNA NUEVA PAGINA POR DEFECTO, PERO NO PUEDO EDITARLO YA QUE EL PHP LO LLAMA PRIMERO Y YA TENDRIA 2 SIDEBARS EN UNA PAGINA Y SI QUIERO OCULTARLO SE DEMORA PORQUE PRIMERO CARGA EL HTML. GRACIAS POR EL APOYO

        1. Como te comentaba Otto, no he utilizado nunca ese plugin y no te puedo ayudar. Te tocará investigar por tu cuenta o ponerte en contacto con el desarrollador de ese plugin.

          Suerte

          1. NADA IGUAL GRACIAS, YA LO RESOLVI, HICE UN PEQUEÑO LOADER PARA QUE CUBRA, EL PROBLEMA DEL SIDEBAR DEL TEMPLATE POR DEFECTO Y YA LO SOLUCIONE GRACIAS.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *:

  • El fin del tratamiento es únicamente la moderación de comentarios para evitar spam
  • La legitimación es tu consentimiento al comentar
  • No se comunicará ningún dato a terceros salvo por obligación legal
  • Tienes derecho al acceso, rectificación y eliminación de los comentarios