Cómo crear un área de widgets «after entry» en un tema clásico de WordPress

En este post aprenderás a crear un nuevo área de widgets «after entry» (al final del contenido de la entrada individual) en un tema clásico de WordPress.

Esto resuelve el problema que se podrá dar si quieres añadir a tu blog un botón para compartir en Mastodon y tienes un tema clásico activo que no posee dicho área de widgets «after entry».

¿Cómo creo un nuevo área de widgets en WordPress, para ubicarla al final de cada entrada del blog?

Este apartado (y solo este, en este artículo) ha sido generado automáticamente utilizando ChatGPT. Esto tiene un propósito meramente experimental con el fin de probar el alcance de una herramienta de IA tan sorprendente como ChatGPT. Teniendo en cuenta que ChatGPT puede ocasionalmente generar información incorrecta, producir instrucciones dañinas o contenido sesgado y posee un conocimiento limitado del mundo y los eventos después de 2021, se ha revisado el texto obtenido con el fin de que se ciña técnicamente al funcionamiento de WordPress. Tras este apartado, puedes ver cómo se aplica en la práctica este proceso para añadir un nuevo área de widgets en WordPress.

[Inicio de la respuesta de ChatGPT]

Para crear un nuevo área de widgets en WordPress que se muestre al final de cada entrada del blog, deberás seguir estos pasos:

1. Abre el archivo functions.php de tu tema de WordPress y agrega una nueva función para registrar el área de widgets. Esta función debería utilizar la función register_sidebar() de WordPress, que toma un conjunto de parámetros para personalizar el área de widgets.
2. Utiliza la función dynamic_sidebar() de WordPress en el archivo de plantilla de la entrada del blog para mostrar el área de widgets al final de cada entrada.
3. Personaliza la ubicación y el diseño del área de widgets utilizando la hoja de estilos de tu tema de WordPress.

Aquí hay un ejemplo de cómo podría verse la función para registrar el área de widgets:

function crear_area_widget() {
  register_sidebar( array(
    'name'          => __( 'Mi Área de Widget', 'textdomain' ),
    'id'            => 'mi-area-widget',
    'description'   => __( 'Una descripción de mi área de widget.', 'textdomain' ),
    'before_widget' => '<section id="%1$s" class="widget %2$s">',
    'after_widget'  => '</section>',
    'before_title'  => '<h2 class="widget-title">',
    'after_title'   => '</h2>',
  ) );
}
add_action( 'widgets_init', 'crear_area_widget' );

En este ejemplo, la función crear_area_widget() se utiliza para registrar un área de widget con la función register_sidebar(). Esta función toma una serie de parámetros para personalizar el área de widget, como su nombre, ID y descripción. También se utilizan algunos valores predeterminados para el contenido que se mostrará antes y después del widget, y antes y después del título del widget.

Luego, en el archivo de plantilla de la entrada del blog, utiliza la función dynamic_sidebar() de WordPress para mostrar el área de widgets al final de cada entrada:

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

En este ejemplo, se comprueba si el área de widget está activa en el sitio utilizando la función is_active_sidebar(). Si el área de widget está activa, se utiliza la función dynamic_sidebar() para mostrar el área de widget en la ubicación en la que se llama a la función en el archivo de plantilla.

[Fin de la respuesta de ChatGPT]

Implementación práctica

Hemos instalado el tema clásico Twenty Twenty One en una instalación de WordPress 6.1.1 y utilizando la aplicación Local.

En un tema de bloques (como Twenty Twenty Two o Twenty Twenty Three), que no posee área de widgets, únicamente hay que editar la plantilla correspondiente al post individual e insertar el elemento que se desee. Puede ser un diseño hecho con bloques, un bloque reutilizable, un patrón o, incluso un shortcode asociado a un código HTML o PHP (ver Cómo añadir en tu WordPress un botón de compartir en Mastodon).

Lo primero que hicimos es instalar y activar el plugin Widget Classic. Este plugin, una vez activado, y cuando uses un tema clásico (no de bloques), restaura las pantallas anteriores de ajustes de widgets y desactiva el editor de bloques para la gestión de widgets. No hay ninguna otra configuración, las pantallas clásicas de ajustes de widgets se activan o desactivan activando o desactivando este plugin. Classic Widgets es un plugin oficial mantenido por el equipo de WordPress que restaura las anteriores («clásicas») pantallas de widgets de WordPress. Recibirá soporte y mantenimiento hasta, al menos, 2024 o tanto como sea necesario.

Después, fuimos a «Go to site folder», desde el panel principal de la app Local, y nos dirigimos a «app > public», la carpeta en la que se encuentra la instalación de WordPress en nuestro ordenador.

Después entramos en la carpeta «wp-content > themes» para llegar al contenido del directorio «twentytwentyone». Ahí se abrió el archivo functions.php y pegamos el código para crear el nuevo área de widget after entry:

register_sidebar( array(
	'id'            => 'after-entry',
	'name'          => __( 'After entry', '<textdomain>' ),
	'description'   => __( 'Este área de widgets aparece solo después del contenido en la página individual de los posts', '<textdomain>' ),
	'before_widget' => '<div id="%1$s" class="widget-container %2$s">',
    'after_widget' => '</div>',
) );

(No olvides sustituir <textdomain> por tu propio texto de dominio.)

Una vez realizada la definición dentro de functions.php, el siguiente paso fue incluir la llamada a la función dentro del archivo con la programación del archivo individual. En el caso del tema Twenty-Twenty One, hay que editar el archivo «template-parts > content > content-single» y añadir lo siguiente justo detrás de la instrucción «the_content();» [recuerda añadir un punto y coma después de the_content()]

if ( is_active_sidebar( 'after-entry' ) ) {
  dynamic_sidebar( 'after-entry' );
}

Conclusiones

Has aprendido a crear un nuevo área de widgets a tu tema clásico (si es que el desarrollador del tema no lo preparó).

Hemos incluido la explicación teórica automatizada de ChatGPT con el fin de experimentar la experiencia de esta herramienta de inteligencia artificial o máquina de aprendizaje.

Espero tus comentarios.