Resumen de IA
¿Está buscando optimizar la experiencia del usuario en su sitio web con la configuración de WPForms Habilitar Autocompletar por URL? ¿Pre-rellenar campos del formulario basándose en interacciones previas? Aprovechar el poder de las cadenas de consulta para autocompletar campos de formulario de un formulario a otro puede mejorar significativamente la comodidad y la eficiencia del usuario.
Imagine un escenario en el que un usuario ya ha proporcionado cierta información en un formulario y desea transferir esos datos sin problemas a otro formulario sin que tenga que volver a introducirlos. Al utilizar cadenas de consulta, puede lograr precisamente eso, creando un viaje más fluido y personalizado para sus visitantes.
Para un tutorial paso a paso de esta funcionalidad en acción, que incluye la creación de los 2 formularios y la transferencia de información de un formulario a otro, eche un vistazo a este artículo.
En este tutorial, nos centraremos más en explicar los tipos de campos y cómo se ven en las cadenas de consulta para permitirle crear sus formularios pre-rellenados.
Habilitar el Autocompletar por URL
Antes de poder empezar a pre-rellenar nuestros campos de formulario, primero debemos habilitar esta opción dentro de nuestro formulario para aceptar estos parámetros pre-rellenados de otro formulario.
Para lograr esto, primero deberá crear un nuevo formulario o editar uno de sus formularios. A continuación, navegue a Ajustes » General dentro del constructor de formularios y, en las opciones Avanzadas, active la opción etiquetada como Habilitar Autocompletar por URL para habilitarla.
Ensamblar la URL
A continuación, deberá construir una URL con una cadena de consulta, utilizando parámetros GET para señalar un campo específico e incluir el valor correspondiente. Curiosamente, el tipo de campo se vuelve irrelevante en este proceso. Independientemente del tipo de campo, todas las cadenas de consulta para habilitar el autocompletado por URL en WPForms se adhieren a una estructura consistente. Por ejemplo, considere la siguiente URL con el formato fundamental de cadena de consulta:
http://test.com?wpf20_1_subfield=value
?wpf: Marca el inicio de una cadena de consulta para la configuración de autocompletado por URL de WPForms.- ID del formulario: Identifica el formulario de destino (en la URL proporcionada, el ID del formulario es 20).
- ID del campo: Especifica el campo deseado dentro del formulario (en la URL dada, el ID del campo es 1).
- Identificador de subcampo (Opcional): Se utiliza únicamente al dirigirse a un subcampo, como el subcampo Ciudad dentro de un campo Dirección (en la URL de ejemplo, simplemente está etiquetado como "subfield").
=(Signo igual): Señala el comienzo del valor.- Valor: Representa el valor deseado que se agregará o seleccionará para un campo. Los espacios deben sustituirse por %20.
Usar la configuración de autocompletado
En el enlace del tutorial anterior, la idea es que su visitante vea el primer formulario y complete información básica. Luego, pase esa información a otro formulario con el botón Enviar.
Para lograrlo, ve a Ajustes » Confirmaciones en el constructor de formularios. A continuación, selecciona Ir a URL (Redirección) en el menú desplegable Tipo de confirmación. Luego, añade la cadena de consulta wpf{formID}_{fieldID} apropiada a la URL de redirección (consulta los ejemplos a continuación).
Un ejemplo es añadir esta URL a la URL de redirección de confirmación. http://midominio.com/contacto?wpf20_1=Eventos%20y%20Fiestas
En este ejemplo, 20 es el ID del formulario y 1 es el ID del campo. La cadena de consulta debe hacer referencia al ID del formulario y del campo en el formato wpf{formID}_{fieldID} para que el campo se rellene previamente (las claves de consulta personalizadas como motivo-contacto no rellenarán los campos de WPForms).
Uso de la lógica condicional con este ajuste
Al utilizar la lógica condicional junto con el ajuste de relleno previo, la funcionalidad operará sin problemas. Los campos condicionales seguirán ocultándose o mostrándose en función de los valores rellenados mediante el relleno previo. Es importante tener en cuenta que la lógica condicional se aplica después de que los campos se hayan rellenado dinámicamente, lo que garantiza que tus formularios sigan funcionando como se espera.
Ejemplos de cadenas de consulta para campos específicos
Para usuarios más avanzados, la siguiente tabla ofrece ejemplos que ilustran cómo configurar parámetros GET para cada tipo de campo. Además, si un campo ofrece varias opciones de formato, también se incluyen ejemplos específicos para esas alternativas.
Texto de una sola línea
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_1=texto%20de%20cualquier%20longitud |
Párrafo
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_2=texto%20de%20cualquier%20longitud |
Desplegable
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_3=Segunda%20Opción |
| Mostrar valores habilitado | ?wpf771_4=dropdown1 |
| Opciones dinámicas: Tipo de publicación | ?wpf771_5=123( 123 es el ID del tipo de publicación) |
| Opciones dinámicas: Taxonomía | ?wpf771_6=12( 12 es el ID de la taxonomía) |
| Valor separado por tuberías (PSV) | ?wpf135_3={field_id="9|value_choice"} |
Opción múltiple
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_7=Segunda%20Opción |
| Mostrar valores habilitado | ?wpf771_8=choice2 |
| Opción de imagen | ?wpf771_9=Segunda%20Opción?wpf771_9=choice2(Depende de la opción Mostrar valores) |
| Opciones dinámicas: Tipo de publicación | ?wpf771_10=123( 123 es el ID del tipo de publicación) |
| Opciones dinámicas: Taxonomía | ?wpf771_11=12( 12 es el ID de la taxonomía) |
| Valor separado por tuberías (PSV) | ?wpf135_3={field_id="9|value_choice"} |
Casillas de verificación
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_12=Segunda%20Opción?wpf771_12[]=Segunda%20Opción?wpf771_12[]=Segunda%20Opción&wpf771_12[]=Tercera%20Opción |
| Mostrar valores habilitado | ?wpf771_13=checkbox2 |
| Opción de imagen | Internacional |
| Opciones dinámicas: Tipo de publicación | ?wpf771_15=123?wpf771_15[]=124( 123 es el ID del tipo de publicación) |
| Opciones dinámicas: Taxonomía | ?wpf771_16=12?wpf771_16[]=13( 12 es el ID de la taxonomía) |
| Valor separado por tuberías (PSV) | ?wpf135_3={field_id="9|value_choice"} |
Números
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_17=2018 |
Nombre
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| Simple | ?wpf771_18=name |
| Nombre Apellido | ?wpf771_18_first=nombre&wpf771_18_last=apellido |
| Nombre SegundoApellido Apellido | ?wpf771_19_first=nombre&wpf771_19_last=apellido&wpf771_19_middle=segundo%20nombre |
Correo electrónico
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | [email protected] |
| Confirmación habilitada | [email protected] |
Acuerdo GDPR
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | No soportado. El usuario debe hacer clic manualmente en la casilla para aceptar. |
Sitio web / URL
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_23=https://google.comAlgunos servidores pueden bloquear las solicitudes que incluyen una URL como parámetro. ¡Asegúrate de probar! |
Dirección
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| EE. UU. | ?wpf771_24_address1=Direcci%C3%B3n%20L%C3%ADnea%201&wpf771_24_address2=Direcci%C3%B3n%20L%C3%ADnea%202&wpf771_24_city=Del%20Mar&wpf771_24_state=CA&wpf771_24_postal=12345 |
| Internacional | ?wpf771_25_address1=Direcci%C3%B3n%20L%C3%ADnea%201&wpf771_25_address2=Direcci%C3%B3n%20L%C3%ADnea%202&wpf771_25_city=Kharkiv&wpf771_25_state=Oblast%20de%20Kharkiv&wpf771_25_postal=61000&wpf771_25_country=Ucrania |
Contraseña
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | No soportado. El usuario debe introducir el/los valor(es) manualmente. |
Teléfono
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| EE. UU./Internacional | ?wpf771_27=5555551234 |
Fecha / Hora
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| Formato: Fecha, Tipo: Selector de fecha | ?wpf771_28_date=22/11/2018 |
| Fecha, Tipo: Menú desplegable de fecha (subcampo) | ?wpf771_29_date_m=11&wpf771_29_date_d=22&wpf771_29_date_y=2018 |
| Hora, Formato: 12 H (subcampo) | ?wpf771_30_time=6:00am |
| Hora, Formato: 12 H (subcampo) | ?wpf771_31_time=13:00 |
Formato: date-time |
?wpf771_32_date=22/11/2018&wpf771_32_time=13:15?wpf771_32_date_m=11&wpf771_32_date_d=22&wpf771_32_date_y=2018&wpf771_32_time=6:30am |
Oculto
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_33=valor%20oculto |
HTML
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | No soportado. Este campo no es editable por el usuario. |
Carga de archivos
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | No compatible. Medidas de seguridad. |
Salto de página
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | No soportado. Este campo no es editable por el usuario. |
Divisor de sección
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | No soportado. Este campo no es editable por el usuario. |
Valoración
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_38=4Resaltará 4/5 o 4/10, dependiendo de la escala de calificación. Un ejemplo sería 4/3. |
Captcha
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | No compatible. El usuario debe completar manualmente el captcha (Matemáticas o Pregunta y Respuesta). |
Firma
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | No compatible. El usuario debe firmar manualmente. |
Escala de Likert
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_41_r2_c1=1?wpf771_41r1_c2[]=1&wpf771_41_r3_c1[]=1r1 indica la primera fila, c2 indica la segunda columna, etc.Soporta escala de calificación de filas únicas/múltiples y respuestas múltiples. |
Puntuación Neta del Promotor
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_42=4Seleccionará el valor 4 de 0 a 10. |
Cupón de Pago
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_1=c%C3%B3digo%20de%20cup%C3%B3n |
Elemento único
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_43=10Solo soporta el Tipo de Artículo "Definido por el Usuario". |
Múltiples artículos
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_44=Second%20Item(opciones de texto e imagen) |
Artículos desplegables
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | ?wpf771_45=Segundo%20Elemento |
Tarjeta de crédito
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | No compatible. El usuario debe introducir manualmente los datos de la tarjeta de crédito. |
Total
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| – | No compatible. El valor se calcula usando JavaScript al cargar la página. |
Campos de Pago (Casillas de Verificación, Múltiples Elementos, Elementos Desplegables) con Cantidades
| Formato / Variaciones del campo | Parámetros GET |
|---|---|
| Estándar | ?wpf938_7={field_id="8|value_choice"} |
| Con Cantidades | ?wpf938_7={field_id="8|value_choice"}&wpq938_7={field_id="8|quantity"} |
Artículos de Referencia
- Para obtener detalles sobre cómo localizar un ID de Formulario o ID de Campo, por favor consulte nuestro tutorial.
- Como regla general, la longitud máxima de una URL es de 2.000 caracteres.
Preguntas frecuentes
P: ¿Cómo uso esto para subetiquetas?
R: Al usar esto para pre-rellenar un campo de Nombre o Dirección que podría tener varios subcampos, nos gustaría compartir un ejemplo con usted.
?wpf1036_1|first={field_id="1|first"}&wpf1036_1|last={field_id="1|last"}&wpf1036_3|address1={field_id="3|address1"}&wpf1036_3|address2={field_id="3|address2"}&wpf1036_3|city={field_id="3|city"}&wpf1036_3|state={field_id="3|state"}&wpf1036_3|postal={field_id="3|postal"}
¡Y eso es todo! Para otro ejemplo específico de esto en acción, consulte este tutorial sobre Cómo Usar Cadenas de Consulta para Pre-Rellenar Campos de Formularios desde Otro Formulario. Para otros ejemplos, consulte nuestro artículo sobre Cómo Usar Cadenas de Consulta para Autocompletar un Campo de Texto.