¿Cómo utilizar campos de WordPress personalizados en plantillas de Tema Builder?

En este artículo, te mostraré cómo agregar y mostrar metadatos dinámicos en sus Divi Builder Plantillas temáticas. Esto es posible gracias a una característica nativa de WordPress (no es necesario para la extensión compleja como ACF): Campos aduaneros.

Después de leer este artículo, si ya no lo sabes, te preguntarás cómo podrías haberlo perdido, créeme!

1 - ¿Qué es WordPress campos personalizados?

El Word personalizado Campos de prensa, también conocido como meta-boxes en el contexto del desarrollo de temas y extensiones, son características que permiten a los usuarios añadir, editar y personalizar información adicional a artículos, páginas o tipos de contenido personalizado.

Esta información adicional se almacena como metadatos y se puede utilizar para ampliar la funcionalidad y personalización de su sitio WordPress más allá del contenido básico ofrecido por WordPress.

En otras palabras, campos personalizados permiten añadir información específica que no está cubierta por campos estándar de WordPress, como título, contenido de artículo, extractos, fecha de publicación, autor, etc. Por ejemplo, si administra un sitio de revisión de libros, puede crear campos personalizados para el autor del libro, editor, año de publicación, etc.

Los valores almacenados en campos personalizados se pueden recuperar y utilizar en temas de WordPress para mostrar información adicional sobre artículos o páginas.

En el pasado, esto requería algunos conocimientos de PHP para modificar los archivos temáticos en un tema infantil con el fin de hacer que estos campos aparezcan en... Pero gracias a Divi Theme Builder¡Es una obra, no hay necesidad de saber cómo código!

Nota: por defecto, WordPress permite añadir campos personalizados a través de la interfaz de administración en la sección del editor de artículos o páginas. Sin embargo, esta interfaz es bastante básica. Por ello, las extensiones como Advanced Custom Fields (ACF), Custom Post Type UI o Meta Box - que ofrecen una interfaz de usuario más fácil de usar - son mucho más populares.

2 - Activar campos personalizados de WordPress

Los campos personalizados son nativos, usted comprenderá. Sin embargo, por defecto, están discapacitados. Depende de ti, como usuario, activarlos. He aquí cómo proceder:

1. Abra el editor de WordPress, en una página o artículo, no importa. Haga clic en los 3 puntos pequeños en la parte superior derecha para abrir las opciones del editor.
2. Al final de la lista, haga clic Preferencias.
3. Abre la pestaña Paneles.
4. Activar campos personalizados.
5. Validar con el botón Mostrar y recargar página.
6. Cuando la página recarga, desplázala, verás una nueva caja llamada Campos aduaneros.

3 - Crear campos personalizados

Ahora que los campos personalizados están activos, usted será capaz de crearlos de esta manera:

1. Baja al fondo del editor, dentro de la publicación para acceder a la caja de campos.
2. Haga clic Add Custom Field.

3. Dale a tu campo un nombre: sin acento, espacio o carácter especial. Incluso se recomienda prefijarlos, por ejemplo: ld_difficulte.
4. Añadir un valor para este campo, por ejemplo Facile.
5. Acabar con Add Custom Field.
6. Tenga en cuenta que estos valores pueden usar HTML. Por ejemplo, para insertar una imagen, puede introducir un valor de este tipo:

<img src="https://example.com/wp-content/uploads/2024/09/image.jpg" width="50px"/>

Ahí tienes. tu publicación ahora tiene nuevos metadatos. Por mi ejemplo, añadí:

• tiempo
• dificultad
• precio
• la opinión
• icono

¡Pero todo depende de tu proyecto, por supuesto!

4 - Agregar campos personalizados dentro de una publicación

Entonces la idea es introducir valores para sus metadatos en cada nueva publicación. Es un hábito de tomar.

Por ejemplo, si publicas críticas de películas, entonces no te olvidarás de entrar cada vez todos los campos que necesites, dentro del propio editor.

Esto sucede de la misma manera que cuando creó estos campos personalizados, excepto ahora, Todo lo que tienes que hacer es llamarlos de la lista desplegable.

En la parte inferior de su publicación, abra la lista desplegable para elegir el campo personalizado. Por mi ejemplo, nota que mis 5 campos aparecen en esta lista.

Para valores: texto, HTML y emojis son aceptados.

No olvides actualizar tu publicación.

¿Lo sabías? Puedes probar Divi gratis visitando en esta página y haciendo clic en "Pruébalo GRATIS"

5 - Mostrar campos personalizados dentro de una plantilla temática

Por supuesto, después de actualizar su publicación, usted notará que estos campos personalizados son invisibles a su publicación. ¡Es normal, tienes que enseñarles! Y ahí es donde el Divi Theme Builder :

1. Vaya a la pestaña Divi Theme Builder y añadir o modificar la plantilla donde desea mostrar los campos personalizados. Por mi ejemplo, edito el modelo Todos los artículos (del blog).
2. También por mi ejemplo, añadiré una fila (una línea) cortada en 5, ya que tengo 5 campos personalizados para mostrar. Puedes elegir otro arreglo.

3. En cada columna, añadiré un Módulo de texto.
4. Eliminar el texto de espera y haga clic icono de bases de datos.

5. Desde la lista desplegable, elija el campo para mostrar. Por ejemplo, ld_temps.
6. En la inserción, puede introducir lo que se mostrará antes y después del valor del campo personalizado (opcional). Por ejemplo, Durée :
7. Validar el campo y su valor.
8. Validar de nuevo.
9. Tenga en cuenta que si el valor de campo utiliza HTML, tendrá que elegir Habilitar HTML en bruto.

6 - Habilidad de la aparición de campos

Por supuesto, no dude en mejorar el diseño de la pantalla de campos personalizados:

• En la pestaña Estilo del módulo de texto, usted puede personalizar todo - alineación de título, grasa, color, etc. Incluso si no lo ves, estos estilos serán aplicados.
• Puedes hacer lo mismo por columnas, filas, etc.

7 - Los campos personalizados aparecen en el modelo

Una vez completado, puede visitar su sitio para ver sus cambios. Por mi ejemplo, nota que cada artículo muestra los campos personalizados dinámicamente... Este es el punto de este tutorial.

9 - Campos personalizados en Divi: en conclusión...

Imagina todo lo que puedes hacer con campos personalizados dentro de una plantilla temática ¡Oye! ¡Es hora de ganar, claramente! Pero también, es muy útil estandarizar el diseño de un sitio.

A menudo, estos metadatos serán útiles en los artículos del blog, pero no sólo! También se pueden utilizar en páginas.

Por ejemplo, eso es lo que usé. mi sitio de entrenamiento donde todas las páginas de entrenamiento deben mostrar un diseño uniforme, sólo cambios de datos. Así que, creamos el diseño una vez sólo gracias a un modelo temático, el resto es sólo datos para cambiar, ¿ves la idea?

Además, tendría curiosidad si estuvieras usando el campos de WordPress nativo personalizado con Divi ? Dime en el comentario...

Para continuar, propongo una lista de reproducción:

• La guía esencial para campos personalizados de WordPress
• Video destacado en artículos Divi con ACF
• Cómo utilizar Divitos Dinámica de Contenido Característica para diseñar un diseño de publicación dinámica