Cómo crear un formulario front-end de ACF [¡Sin código!]

¿Desea utilizar formularios personalizados avanzados en su sitio de WordPress pero no sabe cómo programar? ¡Esta guía lo ayudará a crear un formulario front-end de ACF en muy poco tiempo!

Tiempo aproximado de lectura: 6 minutos

Los campos personalizados avanzados (ACF) son una herramienta poderosa.

Con la capacidad de personalizar sus campos y crear sus formularios exactamente como lo desea, sus posibilidades son casi infinitas.

Pero hay un problema. Debe saber codificar para obtener sus formularios ACF en la parte frontal de su sitio web.

¿O tú?

¡Esta publicación le mostrará cómo crear un formulario de interfaz ACF en WordPress sin código y sin esfuerzo! Y todo se hace usando Formidable Forms , el generador de formularios ACF perfecto.

Entremos en ello.

¿Qué tiene de malo usar el formulario front-end de campos personalizados avanzados?

En realidad, no hay nada de malo en usar ACF para crear su formulario de frontend de campos personalizados avanzados.

ACF es una herramienta poderosa; si sabe codificar en PHP, puede crear formularios únicos rápidamente.

Pero, si no sabes codificar, te quedas rascándote la cabeza ante el idioma extranjero que tienes delante.

Solo echa un vistazo a este código de ejemplo de formulario ACF a continuación:

Así que tienes dos opciones:

1. Aprenda a codificar y cree sus formularios frontend con ACF
2. Deje que Formidable Forms haga todo el trabajo duro por usted

Si bien tenemos un equipo de excelentes desarrolladores aquí en Formidable, imaginamos que tú no.

Por lo tanto, nos centraremos en la opción n.º 2 hoy para nuestro tutorial de formulario de frontend de campos personalizados avanzados.

Cómo mostrar el formulario de interfaz de ACF con Formidable

Para comenzar, necesitará algunas cosas:

1. Formas formidables Plan de negocios
2. Complemento ACF (gratis o profesional)

¡Consigue Formidable Forms ahora!

Para usar algunos de los campos más avanzados con la interfaz de ACF, se requiere la versión pro. Sin embargo, para los campos básicos, puede utilizar la versión gratuita.

Si desea obtener más información, asegúrese de consultar nuestros documentos de la base de conocimiento de ACF.

Entonces, una vez que haya instalado y activado Formidable Forms, vaya a Formidable → Add-ons y haga clic en el botón Instalar para el complemento ACF Form WordPress .

Entonces, son solo unos pocos pasos sencillos:

Empecemos.

Paso 1: crear campos de formulario ACF

Para nuestro ejemplo, tenemos un blog de observación de aves llamado Here Birdie Birdie .

Queremos una manera para que los usuarios tengan sus envíos de observación de aves que se mostrarán automáticamente como un tipo de publicación personalizada en el blog.

Entonces, queremos crear algunos campos para que los usuarios ingresen información:

1. Nombre
2. Fecha
3. Tiempo
4. Lista de pájaros vistos
5. Comentarios adicionales

Entonces, lo primero que queremos hacer es ingresar a ACF para personalizar los campos. Afortunadamente, Formidable admite el mapeo de 19 tipos de campos ACF diferentes. Entonces, tienes muchas opciones.

Para hacer esto, vaya a Campos personalizados → Grupos de campos y haga clic en Agregar nuevo .

A continuación, puede agregar sus campos haciendo clic en el botón Agregar campo .

Por lo tanto, crearemos los campos enumerados anteriormente y los personalizaremos para que se ajusten a nuestras necesidades.

Usaremos un campo repetidor ACF para que sea más fácil para los visitantes mostrar todas las aves que vieron. El campo repetidor permite a los usuarios agregar o eliminar tantas entradas como deseen.

Usaremos un campo desplegable ( Seleccionar en ACF) en estos campos para que el visitante pueda elegir de una lista de aves. También agregaremos un campo numérico para ingresar cuánto tiempo vieron cada ave.

Siéntase libre de personalizar esto según sus propias necesidades. Pero, para obtener funciones más avanzadas (como los repetidores , debe comprar ACF Pro).

Una vez que haya terminado, haga clic en Guardar cambios .

Paso 2: Cree su formulario de interfaz ACF en Formidable

Ahora, crearemos el formulario que se mostrará en la parte frontal de su sitio web.

Entonces, ve a Formidable → Formularios en tu panel de administración de WordPress.

Luego, haga clic en Agregar nuevo en la parte superior de la página, luego elija comenzar desde un formulario en blanco o una de las plantillas de Formidable.

No dude en seleccionar la opción que mejor se adapte a su situación. Empezaremos con un Formulario en Blanco para personalizarlo a nuestro gusto.

Luego, asigne un nombre a su formulario, luego haga clic en Crear .

El complemento lo llevará al generador de formularios de arrastrar y soltar de Formidable, donde puede agregar cualquier elemento de formulario. Nombre, correo electrónico, número, dirección: lo que sea, está aquí.

Dado que ya creamos nuestros campos de formulario en ACF, solo tenemos que agregar campos coincidentes para que sea más fácil conectarlos.

¡Agregamos un campo en la parte superior para que los usuarios puedan nombrar sus publicaciones de blog para que sean únicas!

Una vez que haya terminado de crear su formulario, haga clic en Actualizar para guardar los cambios.

Nada te recuerda más a los 90 que perder todo lo que creaste porque no ahorraste.

Paso 3: mapea tus campos

Ahora que hemos creado nuestro formulario, debemos habilitar el mapeo de campos ACF.

Por lo tanto, haga clic en la pestaña Configuración en la parte superior de la página y vaya a Acciones y notificaciones .

A continuación, elija la acción Crear publicación para personalizar cómo se mostrarán los campos del formulario.

En la acción Crear formulario de publicación , desplácese hacia abajo hasta la sección Campos personalizados y haga clic en el botón Asignar campos de formulario a Campos personalizados avanzados .

Elija su grupo de campos ACF del menú desplegable y comience a mapear sus campos personalizados con los campos Formidable haciendo clic en Agregar .

Además, si usa un campo repetidor, deberá hacer coincidir correctamente los repetidores y los subcampos.

Una vez que haya mapeado sus campos, haga clic en Actualizar para guardar los cambios.

¡Y eso es! Los usuarios ahora pueden enviar sus entradas a su formulario de interfaz ACF de WordPress, y sus campos ACF y Formidable Forms mapearán y enviarán la información.

Desde aquí, puede mostrar la información en la interfaz con una Vista o usar un tema que admita ACF, luego editar la publicación, el título de la publicación, el contenido y más.

¿Qué más puede hacer este complemento de formulario de interfaz de ACF?

Formidable puede parecer un simple creador de formularios para ACF, pero es mucho más que eso.

Con docenas de funciones de formulario ACF, archivos de plantilla y compatibilidad con todos los temas principales (incluido Elementor), Formidable lo hace todo.

Y tiene muchas características y opciones adicionales para potenciar su formulario:

• Formularios de varios pasos, cuestionarios y formularios conversacionales
• Múltiples opciones de protección contra correo no deseado
• Estilizador de formularios visuales incorporado
• Más de 100 plantillas de formulario
• Vistas formidables

Estas son solo algunas de las características que obtiene. Y son bastante geniales si lo decimos nosotros mismos.

Entonces, con lo fácil que es poner un formulario ACF en la interfaz y la gran cantidad de funciones que obtiene, ¿qué está esperando?

Formidable está listo para llevar su sitio web a un nivel superior hoy .

¿Listo para hacer su forma frontal ACF?

Si se preguntaba, "¿Cómo agrego un campo ACF a la interfaz?" Ahora tienes tu respuesta.

Con la sencilla solución sin código de Formidable, puede ponerse en marcha en cuestión de minutos. Y esta publicación te mostró exactamente cómo hacerlo.

Ya sea que use WordPress ACF pro o la versión gratuita, Formidable es el complemento de socio perfecto.

Entonces, si está listo para comenzar, tome Formidable Forms ahora y consígalo en su sitio web.

¡Obtenga formularios frontales de ACF ahora!

Y síganos en Facebook, Twitter y YouTube para obtener más consejos y trucos increíbles de WordPress.

¡Lea más sobre los formularios de WordPress!

• Cómo redirigir después de enviar un formulario en WordPress [¡3 pasos!]
  Lee mas

  Cómo vincular un botón a un formulario en WordPress [¡Una forma sencilla!]
  Lee mas

  Cómo cambiar el color de fondo del bloque de WordPress
  Lee mas