Registrar widgets en WordPress es una de las tareas fundamentales para personalizar cualquier tema. Comprender cómo funcionan las localizaciones (sidebars), cómo se definen en functions.php y cómo se renderizan en el front-end permite tener control total sobre zonas dinámicas como el pie de página.
¿Cómo se registra un sidebar en functions.php?
El primer paso para trabajar con widgets es crear una función en el archivo functions.php que defina la localización donde se cargarán. En WordPress, estas localizaciones se conocen como sidebars, aunque no necesariamente aparezcan en una barra lateral; pueden estar en cualquier parte del tema, incluyendo el footer [01:02].
La función principal que se utiliza es register_sidebar, la cual recibe un array con varios argumentos:
php
function sidebar() {
register_sidebar( array(
'name' => 'Pie de página',
'id' => 'footer',
'description' => 'Zona de widgets para pie de página',
'before_title' => '<p>',
'after_title' => '</p>',
'before_widget' => '<div id="%1$s" class="%2$s">',
'after_widget' => '</div>',
));
}
- name: el nombre visible en el administrador.
- id: el identificador que se usa para llamar al sidebar en las plantillas.
- description: texto descriptivo que aparece en el panel de administración.
- before_title / after_title: etiquetas HTML que envuelven el título del widget. En este ejemplo se usa
<p> para que no destaque demasiado [02:22].
- before_widget / after_widget: envuelven el contenido del widget. Los marcadores
%1$s y %2$s son reemplazados automáticamente por WordPress con el ID y las clases CSS correspondientes al tipo de contenido que se cargue [03:10].
¿Qué hook se necesita para activar los widgets?
Una vez definida la función, es necesario conectarla con WordPress mediante un hook. Para eso se utiliza add_action con el hook llamado widgets_init [04:08]:
php
add_action( 'widgets_init', 'sidebar' );
Un dato importante: los hooks de WordPress que hacen referencia a módulos en plural, como widgets_init o menus, utilizan la forma plural. En cambio, funciones puntuales como wp_head o wp_footer van en singular [04:20]. Tener presente esta convención ayuda a evitar errores de tipeo muy comunes.
¿Cómo se configura un widget desde el administrador?
Antes de registrar al menos un sidebar, la opción de widgets no aparece en el panel de administración. Una vez guardado el código y recargada la página, WordPress muestra la sección Widgets con la localización creada: "Pie de página" junto con su descripción [05:00].
WordPress ofrece widgets predefinidos como audio, contenido, galerías, menú de navegación y páginas. En el ejemplo se utiliza el widget de texto, arrastrándolo hacia la zona "Pie de página" y configurándolo así [05:20]:
- Título: Copyright.
- Contenido: © 2019 Platzi. Todos los derechos reservados.
Al guardar, el widget queda listo, pero aún no se muestra en el sitio porque falta indicar dónde debe imprimirse.
¿Cómo se muestra el widget en el front-end con dynamic_sidebar?
Para renderizar el widget en el sitio, se edita el archivo footer.php. Justo antes de la función wp_footer(), se agrega una etiqueta <footer> con un contenedor de Bootstrap para mantener el diseño alineado con el resto de la página [05:55]:
php
<footer>
<div class="container">
<?php dynamic_sidebar( 'footer' ); ?>
</div>
</footer>
La función dynamic_sidebar recibe como argumento el ID del sidebar registrado previamente. En este caso, 'footer' corresponde exactamente al valor definido en register_sidebar [06:15]. Al refrescar el navegador, el pie de página aparece con el mensaje configurado desde el administrador.
Este flujo completo —registrar el sidebar, conectarlo con un hook, configurar el widget desde el panel y llamarlo con dynamic_sidebar— es el patrón estándar para manejar zonas dinámicas en cualquier tema de WordPress. ¿Has implementado widgets personalizados en tus proyectos? Comparte tu experiencia en los comentarios.
