Breaking

Post Top Ad

Your Ad Spot

miércoles, 25 de marzo de 2020

Cómo agregar meta cuadros personalizados en publicaciones y tipos de publicaciones de WordPress

¿Desea crear meta cuadros personalizados para sus publicaciones, páginas y tipos de publicaciones personalizadas de WordPress? Los meta cuadros personalizados se usan comúnmente para proporcionar una mejor interfaz de usuario para agregar campos personalizados (meta datos) a su contenido. En este artículo, explicaremos qué es un metacuadro personalizado y cómo puede agregar fácilmente metacuadros personalizados en publicaciones y tipos de publicaciones de WordPress.
Cómo agregar meta cuadros personalizados en publicaciones de WordPress

¿Qué es un Meta Box personalizado en WordPress?

Meta box personalizado es una interfaz más fácil de usar para agregar campos personalizados (metadatos) en sus publicaciones, páginas y otros tipos de publicaciones personalizadas.
WordPress viene con una interfaz fácil de usar que te ayuda a crear contenido como publicaciones y páginas , o tipos de publicaciones personalizadas .
Normalmente, cada tipo de contenido consta del contenido real y sus metadatos. Los metadatos son información relacionada con ese contenido, como la fecha y la hora, el nombre del autor, el título y más. También puede agregar sus propios metadatos utilizando campos personalizados .
Campos Personalizados
Sin embargo, agregar metadatos utilizando el cuadro de campos personalizados predeterminado no es muy intuitivo. Aquí es donde entran los meta cuadros personalizados.
WordPress permite a los desarrolladores crear y agregar sus propios meta cuadros personalizados en las pantallas de edición posterior. Así es como los complementos más populares agregan diferentes opciones en las pantallas de edición de publicaciones.
Por ejemplo, el cuadro de título y meta descripción de SEO dentro del complemento Yoast SEO es un cuadro de meta personalizado:
Categoría SEO Título y Meta descripción en Yoast SEO
Dicho esto, veamos cómo puede agregar fácilmente meta cuadros personalizados en publicaciones y tipos de publicaciones de WordPress.

Creación de meta cuadros personalizados en WordPress

Primero, lo que debe hacer es instalar y activar el complemento Campos personalizados avanzados . Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress .
Tras la activación, el complemento agrega un nuevo elemento de menú etiquetado como 'Campos personalizados' a su barra de administración de WordPress. Al hacer clic en él, accederá a la página de campos personalizados.
Esta página estará vacía ya que aún no ha creado ningún campo personalizado. Continúe y haga clic en el botón 'Agregar nuevo' para continuar.
Agregar nuevo grupo de campos personalizados
Se lo dirigirá a la página 'Agregar nuevo grupo de campos'.
Aquí debe proporcionar un título para su grupo de campo. Este título se usará como el título de su meta box.
Después de eso, puede comenzar a agregar sus campos. Simplemente haga clic en el botón '+ Agregar campo' para agregar su primer campo.
Agrega tu campo de puño
Esto abrirá el formulario de configuración de campo. Primero debe proporcionar una etiqueta para su campo. Esta etiqueta se mostrará en su cuadro meta antes del campo.
Crear un nuevo campo para su meta cuadro personalizado
Después de eso, debe seleccionar el tipo de campo. El complemento Advanced Custom Fields le permite elegir entre una amplia gama de opciones. Esto incluye texto, área de texto, botones de opción, casillas de verificación, editor WYSIWYG completo, imágenes y más.
A continuación, debe proporcionar instrucciones de campo. Estas instrucciones le indicarán a los usuarios qué agregar al campo.
Debajo de eso, encontrará otras opciones para su campo. Debe revisar cuidadosamente estas opciones y ajustarlas para que coincidan con sus necesidades.
Configuraciones de campo
A continuación, haga clic en el botón Cerrar campo para contraer el campo.
Si necesita agregar más campos a su metabox, haga clic en el botón '+ Agregar campo' para agregar otro campo.
Cerrar campo y agregar otro
Una vez que haya terminado de agregar campos, puede desplazarse hacia abajo a la sección de ubicación. Aquí es donde puede definir cuándo y dónde desea que se muestre su meta cuadro.
Reglas de ubicacion
Advanced Custom Fields viene con un puñado de reglas predefinidas para que pueda elegir. Por ejemplo, puede seleccionar tipos de publicación, categoría de publicación, taxonomía, página principal y más.
A continuación, viene la configuración de opciones de meta box.
Primero debe elegir el número de pedido. Si tiene múltiples grupos de campos definidos para una ubicación, puede seleccionar el número de pedido para que se muestren. Si no está seguro, déjelo como 0.
Opciones de meta box
A continuación, debe elegir la posición del cuadro meta en la página. Puede elegir mostrarlo después del contenido, antes del contenido o en la columna derecha.
Debajo de eso, deberás elegir un estilo para tu meta box. Puede elegir que sea como todos los demás meta cuadros de WordPress, o puede elegir que sea transparente (sin ningún cuadro meta).
Si no está seguro, seleccione la opción Estándar (cuadro Meta WP).
Por último, verá una lista de campos que normalmente se muestran en una pantalla de edición posterior. Si desea ocultar un campo en particular en la pantalla de edición de su publicación, puede verificarlo aquí. Si no está seguro, lo mejor es dejarlos sin marcar.
Una vez que haya terminado, haga clic en el botón publicar para hacer que su grupo de campo viva.
Publica tu grupo de campo
Felicitaciones, ha creado con éxito su metacuadro personalizado para su publicación o tipo de publicación de WordPress.
Dependiendo de su configuración, ahora puede visitar su publicación o tipo de publicación para ver su meta cuadro personalizado en acción.
Vista previa personalizada de metabox
Puede usar este metacuadro personalizado para agregar metadatos a sus publicaciones o tipos de publicaciones. Estos datos se almacenarán en su base de datos de WordPress cuando guarde o publique la publicación.

Mostrar sus datos de Meta Box personalizados en el tema de WordPress

Hasta ahora hemos creado con éxito un meta cuadro personalizado y lo mostramos en nuestra pantalla de edición de publicaciones. El siguiente paso es mostrar los datos almacenados en esos campos en su tema de WordPress.
Primero, debe editar el grupo de campos personalizados que creó anteriormente. En la página 'Editar grupo de campos', verá sus campos personalizados y sus nombres.
Nombres de campo
Necesitará los nombres de estos campos para mostrarlos en su sitio web.
Los campos personalizados avanzados le permiten hacerlo de dos maneras diferentes.
Primero, puede usar un código corto para mostrar un campo personalizado en su publicación.
[acf field="article_byline"]
También puede mostrarlos agregando código a sus archivos de tema de WordPress. Si no ha hecho esto antes, eche un vistazo a nuestra guía para principiantes sobre cómo copiar y pegar código en WordPress .
Deberá editar el archivo de tema donde desea mostrar los datos de estos campos. Por ejemplo, single.php, content.php, page.php, etc.
Deberá asegurarse de agregar el código dentro del bucle de WordPress . La forma más fácil de asegurarse de que está ingresando el código dentro del bucle es buscar una línea en su código que se vea así:
1
<?php while ( have_posts() ) : the_post(); ?>
Puede pegar su código después de esta línea y antes de la línea que finaliza el ciclo:
1
<?php endwhile; // end of the loop. ?>
Su código de campo personalizado se vería así:
1
<h2 class="article-byline"><?php the_field('article_byline'); ?></h2>
Este código mostrará los datos ingresados ​​en el campo de la línea del artículo de nuestro meta cuadro personalizado.
Observe cómo envolvimos el código en un encabezado h2 con una clase CSS. Esto nos ayudará a formatear y diseñar el campo personalizado más adelante al agregar CSS personalizado a nuestro tema.
Aquí hay otro ejemplo:
1
2
3
4 4
5 5
<blockquote class="article-pullquote">
 
<?php the_field('article_pullquote'); ?>
 
</blockquote>
No olvide reemplazar los nombres de campo con sus propios nombres de campo.
Ahora puede visitar la publicación donde ya ingresó los datos en sus campos personalizados. Podrá ver sus metadatos personalizados mostrados.
Campos personalizados que se muestran en un sitio web
Advanced Custom Fields es un complemento muy potente con muchas opciones. Este tutorial solo rasca la superficie. Si necesita más ayuda, no olvide consultar la documentación del complemento sobre cómo extenderlo aún más.
Esperamos que este artículo te haya ayudado a aprender cómo agregar meta cuadros personalizados en publicaciones y tipos de publicaciones de WordPress. También puede consultar nuestra guía paso a paso sobre cómo aumentar la velocidad y el rendimiento de WordPress para principiantes.
Si le gustó este artículo, suscríbase a nuestro canal de YouTube para ver videos tutoriales de WordPress. También nos puede encontrar en Twitter y Facebook .

No hay comentarios.:

Publicar un comentario

Dejanos tu comentario para seguir mejorando!

Post Top Ad

Your Ad Spot

Páginas