Contenidos del Post
Cuando estamos diseñando nuestra página web en ocasiones nos encontramos con la necesidad de añadir un nuevo widget en nuestro WordPress en una zona en la que por defecto nuestra plantilla no nos permite la opción.
A pesar de parecer un impedimento grande para conseguir la apariencia que buscamos en nuestro diseño, su solución no es nada complicada y podemos crear nuevas zonas de widget añadiendo unas pocas líneas a nuestro código.
Mi consejo antes de empezar a modificar archivos es crear un tema hijo o child theme. De esta manera mantenemos la plantilla original sin cambios, con lo que nos ahorramos posibles problemas al hacer una actualización del tema ya que los cambios de código que hayamos realizado se perderían.
Paso 1: crear una nueva Zona de Widget tu Administración WordPress
Abrimos el fichero functions.php de la raíz de la plantilla
/wp-content/themes/mi_tema/functions.php
Si estamos trabajando con un tema hijo
/wp-content/themes/mi_tema-child/functions.php
Añadimos el siguiente código al final del documento:
function nuevas_zonas_widgets() {
register_sidebar( array(
'name' => 'Nueva Zona Widget',
'id' => 'idNuevaZona',
'description' => 'Descripción de la nueva Zona de Widgets',
'before_widget' => '<section class="widget-class">',
'after_widget' => '</section>',
'before_title' => '<h2 class="widget-title">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'nueva_zona_widgets' );
¿Qué hay que saber del código anterior?
Si no eres muy diestro con el código de WordPress no te preocupes mucho, simplemente lo que hacemos es crear una función llamada nuevas_zonas_widgets() y dentro de está podremos crear tantas zonas como necesitemos, copiando y pegando el register_sidebar() y sus valores:
name: Es el nombre que le daremos a la nueva zona, por ejemplo: Footer.
id: Identificador de la nueva zona, para que no te lies te recomiendo que utilices el mismo valor que en el campo anterior pero utilizando minúsculas, por ejemplo: footer
description: Puedes añadir un pequeño texto desciptivo del estilo “Los widgets de esta zona se mostrarán en el footer”
before_widget /after_widget: Puedes envolver los widgets de esta zona en una etiqueta HTML como un div o section y añadirles las clases o los id que necesites.
before_title/after_title: Esta será la etiqueta que envuelva al titulo de tu widget, en el ejemplo los títulos estarán envueltos por una etiqueta h2 pero puedes poner la que necesites.
2, Mostar la nueva Zona de Widget en tu Plantilla WordPress
Una vez registradas la zona o zonas que necesitamos tenemos que hacer que aparezcan en nuestro diseño. Tenemos que tener un poco claro como está estructurada nuestra plantilla para saber qué fichero debemos modificar. Por ejemplo, si lo que queremos en ess que nuestro widget se carguen en el footer debemos modificar el fichero footer.php y añadir el siguiente código en la parte que queremos que aparezca:
<?php if ( is_active_sidebar( 'id-widget' ) ) : ?>
<div id="id-widget">
<?php dynamic_sidebar( 'id-widget' ); ?>
</div>
<?php endif; ?>
Recuerda cambiar 'id-widget' por el valor que tu hayas elegido.
Ya podemos ir al panel de administración de WordPress y desde ahí colocar los widgets dentro de la nueva zona que hemos creado para que se carguen en nuestro footer o cualquier parte que hayamos modificado en el paso anterior. Con esto y personalizando un poco tu css podremos conseguir el diseño que andábamos buscando.