Hace poco más de un año aprendimos a mostrar una barra lateral en las páginas de WooCommerce dentro del tema gratuito Zerif Lite, de ThemeIsle.

Esas instrucciones simplemente sirven para incluir el área de widgets que ya existe en el tema, y que es común a todas las páginas del blog. Esto es sin dudas una limitación, ya que si usamos tanto la tienda como el blog nos veremos obligados a mostrar los mismos widgets en ambas secciones.

Para poder mostrar widgets distintos, tendremos que crear un área específica para la tienda y los productos de WooCommerce.

Paso 1: registrar el área de widgets

Lo más probable es que ya tengamos el tema hijo creado, con el área de widgets agregada en la plantilla de WooCommerce. Si así no fuera el caso, tendremos que seguir las instrucciones de esta entrada (solo el Paso 1) para crear el tema hijo.

Una vez creado, en el archivo functions.php, antes del cierre de la etiqueta ?> (si lo hubiera) pegamos lo siguiente:

function woocommerce_sidebar_widgets() {
    register_sidebar( array(
        'name' => __( 'Barra lateral de Tienda', 'zerif-lite' ),
        'id' => 'area-tienda',
        'description' => __( 'Widgets para las páginas de WooCommerce', 'zerif-lite' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget' => '</aside>',
        'before_title' => '<h2 class="widget-title">',
        'after_title' => '</h2>',
    ) );
}
add_action( 'widgets_init', 'woocommerce_sidebar_widgets' );

Con esto veremos que se ha añadido un nuevo panel en nuestra página de Widgets.

Paso 2: incluir el área de widgets en la plantilla de WooCommerce

El código anterior por sí solo no nos va a servir de mucho si no lo “llamamos” desde la correspondiente plantilla. Así es que abriremos el archivo woocommerce.php, y reemplazaremos la línea:

<?php get_sidebar(); ?>

Por:

<?php
    if ( is_active_sidebar( 'area-tienda' ) ) :
    dynamic_sidebar( 'area-tienda' );
    endif;
?>

Recordemos que estamos usando el código de esta entrada (tema hijo previamente creado y archivo woocommerce.php en la carpeta del tema hijo con el código correspondiente).

Vamos a agregar algunos widgets:

El resultado:

Y nuestras páginas del blog conservarán la barra lateral predeterminada. 🙂

Caribdis Diseño Web

Caribdis Diseño Web

Ana Ayelén Martínez - Buenos Aires, Argentina
Técnica en Electromecánica, Periodista, entusiasta de los idiomas y enamorada de WordPress. Amante de la lectura, la música y el mate, y fanática de las series de J.J. Abrams.
Caribdis Diseño Web