Cómo añadir cajas meta personalizadas en entradas y tipos de entradas de WordPress

WordPress añade metadatos a su contenido automáticamente, como la fecha de publicación, las categorías y las etiquetas. Sin embargo, también puede añadir sus propios metadatos personalizados.

Tanto si necesita recopilar información adicional como agilizar el proceso editorial o mejorar la interfaz de usuario, las cajas meta pueden ser una potente herramienta para gestionar contenidos de forma flexible.

En WPBeginner, utilizamos cajas meta personalizadas para potenciar la funcionalidad de nuestras entradas y páginas. Esto nos ha dado una comprensión más profunda de los pros y los contras de la adición de campos personalizados para optimizar el contenido.

En este artículo, le mostraremos cómo añadir fácilmente información única a su contenido mediante la creación de una caja meta de datos personalizada en WordPress.

¿Qué es una caja meta personalizada en WordPress?

Cuando creas entradas y páginas, o tipos de contenido personalizados en WordPress, ese contenido suele tener sus propios metadatos. Estos metadatos son información relacionada con el contenido, como la fecha y la hora, el nombre del autor, el título, etc.

También puede añadir sus propios metadatos utilizando el cuadro de campos personalizados por defecto.

Consejo profesional: ¿No ves el cuadro de campos personalizados en el editor de entradas? Entonces consulte nuestra guía sobre cómo corregir los campos personalizados que no se muestran en WordPress.

El cuadro Campos personalizados es una buena solución si sólo desea añadir metadatos personalizados a unas pocas entradas. Sin embargo, si planea añadir mucha información única a su contenido, entonces tiene sentido crear un cuadro de metadatos personalizados.

De hecho, muchos de los plugins más populares de WordPress añaden cajas meta personalizadas a la pantalla de edición de entradas y páginas. En la siguiente imagen, puede ver lo fácil que es añadir información SEO a sus entradas utilizando una caja meta personalizada proporcionada por AIOSEO.

Dicho esto, veamos cómo puede añadir fácilmente cajas meta personalizadas en entradas y tipos de entradas de WordPress.

Cómo añadir cajas meta personalizadas en entradas y tipos de entradas de WordPress

La forma más sencilla de añadir cajas meta personalizadas a WordPress es utilizando Advanced Custom Fields. Este plugin le permite adjuntar todo tipo de información adicional a sus entradas y páginas y luego mostrar esos datos a los visitantes mediante un shortcode.

Lo primero que tienes que hacer es instalar y activar el plugin Advanced Custom Fields. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Crear una caja meta personalizada

Una vez activado, visite la página ACF ” Grupos de campos desde la barra lateral del administrador de WordPress.

Aquí, haga clic en el botón “Añadir nuevo”.

Ahora puede crear los campos personalizados que aparecerán en el cuadro de metadatos.

Para empezar, tendrás que escribir un título en el campo que muestra por defecto ‘Título del grupo de campos’. Esto aparecerá en el editor de contenido de WordPress, y se utilizará como el título de su caja meta.

Dicho esto, deberías usar algo descriptivo, especialmente si gestionas un blog de WordPress con varios autores o compartes el escritorio con otras personas.

Una vez hecho esto, está listo para añadir el primer campo a su caja meta.

Añadir campos personalizados a la caja meta de WordPress

Para empezar, abra el menú desplegable “Tipo de campo” y elija el tipo de campo que desea añadir, como el selector de fecha, la casilla de verificación o el campo de texto.

A continuación, escriba una etiqueta para el campo.

Los campos personalizados avanzados mostrarán esta etiqueta antes del campo, para ayudar a los usuarios a comprender qué información deben introducir.

Advanced Custom Fields generará el ‘Nombre del campo’ automáticamente, por lo que puede dejar este campo vacío.

Una vez hecho esto, es posible que desee escribir un ‘Valor por defecto’. Esto se añadirá a la página, entrada o tipo de contenido personalizado automáticamente si el usuario no añade su propia información.

Es posible que vea más opciones dependiendo del tipo de campo que esté creando. Por ejemplo, si ha seleccionado “Imagen” en el menú desplegable “Tipo de archivo”, podrá elegir el formato de la imagen.

La mayoría de estas opciones se explican por sí mismas, por lo que puede seguir las instrucciones que aparecen en pantalla para configurar el campo personalizado.

Cuando esté satisfecho con cómo se ha establecido el campo, haga clic en el botón “Cerrar campo” para cerrar la sección.

Ahora puede añadir más campos a la caja meta personalizada al hacer clic en el botón “Añadir campo”.

A continuación, sólo tiene que configurar el campo siguiendo el mismo proceso descrito anteriormente.

Añadir una caja meta personalizada al editor de contenido de WordPress

Cuando esté satisfecho con cómo se ha establecido la caja meta personalizada, tendrá que definir dónde y cuándo aparecerá la caja meta.

Para ello, desplácese hasta la sección “Ajustes” y haga clic en la pestaña “Reglas de ubicación”.

Advanced Custom Fields puede añadir la caja a todo tipo de contenido. Por ejemplo, puede mostrar la caja meta en determinados tipos de entradas, categorías, taxonomías, menús de navegación, etc.

Simplemente utilice los menús desplegables para elegir dónde aparecerá la caja meta en su escritorio de WordPress. Por ejemplo, si aceptas entradas de invitados, puedes añadir el cuadro a todas las entradas de la categoría “Entradas de invitados”.

A continuación, haga clic en la pestaña “Presentación”.

Aquí puede elegir el estilo de la caja meta, dónde aparecerá en su blog de WordPress y dónde aparecerán la etiqueta y las instrucciones.

Si tiene previsto añadir varias casillas en el mismo lugar, puede cambiar el orden en que aparecen escribiendo en el campo “Número de pedido”.

Por ejemplo, mostrar las cajas meta más importantes en la parte superior de la pantalla puede mejorar el flujo de trabajo editorial.

Si no está seguro, puede dejar este campo establecido en 0.

En esta pantalla, también verá un catálogo de todos los campos que WordPress suele mostrar en la pantalla de edición de entradas.

Si desea ocultar un campo, simplemente marque / compruebe su casilla. Por ejemplo, si utiliza campos personalizados para crear un cuadro de información sobre el autor, puede ocultar el campo “Autor” por defecto.

Cuando esté satisfecho con los cambios realizados, haga clic en “Guardar cambios” para activar el grupo de campos.

Ha creado correctamente una caja meta personalizada para su entrada, página o tipo de contenido personalizado en WordPress. Dependiendo de sus ajustes, ahora puede visitar el editor de entradas para ver la caja meta personalizada en acción.

Visualización de los datos de su caja meta personalizada en el tema de WordPress

Ha añadido correctamente una caja meta personalizada al escritorio de WordPress. Cualquier información que los usuarios escriban en la caja meta será guardada en la base de datos de WordPress cuando guarden o publiquen la entrada. Sin embargo, esta información no aparecerá en su sitio web por defecto.

Con esto en mente, asegurémonos de que los metadatos personalizados aparecen en su tema de WordPress para que los visitantes puedan verlos.

Puede hacerlo mediante shortcode o editando los archivos de su tema de WordPress.

Cómo mostrar metadatos personalizados mediante shortcode

Añadir un shortcode en WordPress es el método más sencillo y le permite controlar exactamente dónde aparece la información en su sitio web.

Por ejemplo, si ha creado un campo “Valoración / puntuación de estrellas”, puede mostrar esta información después del título de la entrada, dentro del contenido, en el pie de página o en cualquier otro lugar simplemente añadiendo un shortcode.

Sin embargo, tendrá que añadir manualmente un shortcode a cada página, entrada o tipo de contenido personalizado. Esto puede llevar mucho tiempo y esfuerzo, especialmente si tienes mucho contenido.

Para obtener el shortcode de un campo, vaya a ACF ” Grupos de campos. A continuación, pase el cursor sobre el grupo de campos que desee mostrar y haga clic en el enlace “Editar” cuando aparezca.

Ahora verá todos los campos que componen este grupo.

Para cada campo que desee visualizar, anote el valor en el campo “Nombre”.

Una vez hecho esto, vaya a la página, entrada o tipo de contenido personalizado en el que desea mostrar los metadatos personalizados.

Ahora puede hacer clic en el icono “+” y escribir “Shortcode”.

Cuando aparezca el bloque adecuado, haga clic para añadirlo a su estructura / disposición / diseño / plantilla.

Ahora puede añadir el siguiente shortcode al bloque, asegurándose de sustituir "article_byline" por el nombre del campo que desea mostrar.

Ahora puede repetir estos pasos para añadir varios campos personalizados a la entrada.

Cuando esté satisfecho con los cambios realizados, haga clic en el botón “Publicar” o “Actualizar”. Ahora, simplemente visita tu sitio web WordPress para ver los metadatos personalizados en acción.

Cómo mostrar metadatos personalizados editando su tema de WordPress

Si desea mostrar metadatos personalizados en la misma ubicación en cada página, entrada o tipo de contenido personalizado, puede añadir código a los archivos de su tema de WordPress.

Esto puede ahorrarte tiempo a largo plazo, pero no es el método más adecuado para principiantes. También perderás todo el código personalizado la siguiente vez que actualices tu tema de WordPress, por lo que te recomendamos crear un tema hijo. Entonces podrás añadir tu código personalizado al tema hijo.

Si no ha editado antes los archivos de su tema, eche un vistazo a nuestra guía para principiantes sobre cómo copiar y pegar código en WordPress.

Tendrás que editar el archivo donde quieres mostrar los metadatos personalizados. Esto variará en función de tu tema, pero normalmente tendrás que editar el archivo single.php, content.php o page.php de tu sitio.

Una vez que tenga el archivo correcto, tendrá que añadir el código dentro del bucle de WordPress. Para encontrar este bucle, simplemente busque el siguiente código que se parece a esto:

	<?php while ( have_posts() ) : the_post(); ?>

A continuación, puede pegar su código después de esta línea y antes de la línea que finaliza el bucle:

	<?php endwhile; // end of the loop. ?>

A modo de ejemplo, el código de su campo personalizado debería tener este aspecto:

	<h2 class="article-byline"><?php the_field('article_byline'); ?></h2>

Fíjate en cómo hemos envuelto el código en un encabezado h2 con una clase CSS. Esto nos permite dar formato y estilo al campo personalizado más tarde añadiendo CSS personalizado a nuestro tema.

He aquí otro ejemplo:

<blockquote class="article-pullquote">
 
<?php the_field('article_pullquote'); ?>
 
</blockquote> 

Cuando añadas código a tu tema, no olvides sustituir los nombres de los campos.

Una vez hecho esto, puede visitar cualquier entrada en la que ya haya introducido datos en los campos personalizados. Ahora verás tus metadatos únicos en acción.

Esperamos que este artículo te haya ayudado a aprender cómo añadir cajas meta personalizadas en entradas y tipos de entradas de WordPress. Puede que también quieras ver nuestra guía sobre cómo mostrar metadatos de entradas de blog en temas de WordPress y nuestro tutorial sobre cómo personalizar extractos de WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.