×

CONTÁCTANOS

¿Necesitas ayuda? Disponemos de la información que necesitas.

Base de conocimientos aero-right Formularios de registro aero-right Cómo crear formularios de registro

Cómo crear formularios de registro

Formularios de registro Actualizado en abril 23, 2021

Usar formularios de registro es la forma más inteligente de obtener suscriptores a través de tu sitio web, página de blogs, email o página de destino. En Benchmark Email tenemos diversos formularios aptos para cada necesidad, sigue leyendo para conocer cuál de nuestros formularios se adapta más a tu estrategia.

Haz clic sobre el tipo de formulario en el cual estás interesado:

Antes de comenzar, por favor lee lo siguiente:

  • Las cuentas gratuitas tienen un límite de 75 registros por día.
  • Las cuentas de pago no tienen límite de registros.
  • El formulario integrado solo se encuentra disponible para usuarios de la nueva interfaz.
  • El formulario integrado ha reemplazado al formulario clásico.
  • Los formularios integrados, como su nombre indica, están embebidos en tu sitio o página como parte de la misma.
  • Para modificar el formulario deberás ingresar al editor.
  • Desde Septiembre de 2018, algunas servicios de Google fueron bloqueados en China. Debido a esta restricción es posible que la función reCaptcha no funcione correctamente con usuarios de esta región. Conoce más sobre el tema aquí.
  • Formularios Javascript (Seguimiento de sitio web incluido): Los cambios o actualizaciones realizados a los formularios Javascript aparecerán automáticamente en tu sitio web.
  • Formularios HTML (Seguimiento de sitio web incluido): Los cambios o actualizaciones realizados a los formularios Javascript NO aparecerán automáticamente en tu sitio web. Para ver estos cambios necesitarás, guardar y publicar el formulario nuevamente, y copiar y pegar el código HTML de nuevo en el sitio web.

 

FORMULARIO INTEGRADO

Sigue los pasos a continuación para crear un formulario integrado en tu sitio web y personalizado:

  1. En el panel de control selecciona Contactos.
  2. Después haz clic en Formularios de Registro.
  3. Haz clic en el botón CREAR UN FORMULARIO
  4. Selecciona FORMULARIO INTEGRADO y haz clic en Siguiente.
  5. Dale un nombre a tu formulario y selecciona la lista donde serán guardados los registros, después, haz clic en Guardar y seguir.
  6. Te encuentras en el editor de formularios de Benchmark.
    1. En el botón Configuración Opt-in, tendrás las opciones de confirmación, como email de confirmación y páginas de destino.
    2. Puedes cambiar la apariencia de tu formulario además de agregar los campos que necesites.
  7. Al terminar haz clic en Guardar y publicar.
  8. Aparecerá el código de tu formulario selecciona el tipo de código que necesitas y cópialo para después pegarlo en tu sitio.

Importante

  • Si no modificas el ancho del formulario, este se ajustará al ancho del espacio dado en tu sitio web.
  • El ancho máximo será de 999px. Esto solo será visible en la pantalla de un ordenador, en pantallas más chicas como la de smartphone, este ancho se ajustará.

Qué puedes personalizar en tu formulario

  • Puedes modificar el ancho del formulario si te es necesario, sin embargo, te recomendamos dejar que el mismo formulario se ajuste a el espacio dado en tu sitio.
  • Cambia el color del fondo, añade bordes, redondea las esquinas cambia el color de texto y botones.
  • También puedes añadir imágenes, descripciones, separaciones, encabezados y más campos.
  • En este formulario puedes agregar tantos campos como te sean necesarios. Pero, te recomendamos mantenerlo corto y conciso.

¿Necesitas algunas ideas? Estos formularios fueron hechos con la herramienta de formularios de Benchmark.

Regresar al inicio

 

FORMULARIO COMPACTO

Toma en cuenta los siguiente puntos antes de elegir este formulario:

  • Este formulario tomará el tamaño del espacio donde sea colocado.
  • Además solo permite colectar el email, nombre y apellido del visitante.

Sigue estos pasos para crear un formulario compacto:

  1. Inicia sesión en tu cuenta de Benchmark.
  2. En el panel principal selecciona Contactos.
  3. Haz clic en Formularios de registro.
  4. Haz clic en el botón CREAR UN FORMULARIO.
  5. Selecciona FORMULARIO COMPACTO y haz clic en Siguiente.
  6. Dale un nombre al formulario y selecciona una lista.
  7. Haz clic en Guardar y seguir.
  8. Crea y edita tu formulario.

Al terminar haz clic en Guardar y publicar. Apareceré el código, selecciona el tipo que necesitas, cópialo y pégalo en tu sitio.

Qué puedes personalizar en tu formulario

Debido a que este formulario es “compacto” se encuentra limitado a solo tres campos; nombre, apellido y correo electrónico. Además, este formulario no soporta imágenes.

  • Puedes cambiar el ancho del formulario, sin embargo, te recomendamos que permitas que el formulario se ajuste al ancho del espacio dado en tu sitio web.
  • Puedes cambiar el color de fondo, encabezado y estilo del botón de registro.

¿Necesitas inspiración? Estos formularios han sido hechos con el editor de formularios de Benchmark.

 

Regresar al inicio

Cómo configurar horizontalmente el formulario compacto

Los formularios compactos te permiten añadir tres campos, nombre, apellido y dirección de correo electrónico, por esto consideramos que es el tipo de formulario perfecto para ser añadido horizontalmente a tus diseños, incluso dependiendo del diseño te recomendamos usar dos de los tres campos disponibles.

Sigue los pasos a continuación para configurar un formulario compacto horizontalmente.

Comenzaremos desde la herramienta para crear formularios de Benchmark.

Crea un formulario de registro compacto desde la herramienta formularios de registro de Benchmark.

  1. Una vez que tu formulario esté listo, haz clic en el botón guardar y publicar.

  1. En la ventana emergente confirma los cambios. Una nueva ventana emergente aparecerá, haz clic en el menú desplegable y selecciona la opción Código HTML.
  2. Haz clic en el botón con la leyenda COPIA. Automáticamente todo el código será copiado.

  1. Cierra la ventana emergente y regresa al panel de control principal haciendo clic en el logo de Benchmark ubicado en la esquina superior.

Ahora, continuaremos el proceso desde el editor de código HTML de Benchmark.

  1. Selecciona campañas desde el panel de control principal y nuevamente campañas.
  2. Haz clic en el botón crear una nueva campaña y selecciona campaña de email regular.
  3. IMPORTANTE: Selecciona EDITOR HTML.

  1. Dale un nombre a tu campaña, el propósito de esta campaña no es ser enviada a tus contactos, por lo tanto al final te recomendamos eliminarla, ya que no será útil posteriormente.
  2. No necesitas llenar todos los campos de la lista de verificación, ve directamente a la opción diseño.

  1. Reemplaza el texto existente en la ventana de la izquierda con el código HTML previamente copiado del formulario de registro compacto. Una vez hecho esto, observarás el formulario de registro en la ventana de la derecha.

No te preocupes por la información al pie del formulario en este momento. Esta información no se copiará ni será parte de tu formulario al final.

  1. Ahora, utiliza tu teclado (cmd+f en mac o ctrl+f en windows) para buscar los campos.

Este es un ejemplo de lo que estamos buscando:

  1. En la barra de búsqueda escribe: fieldset o el nombre del campo (ej. nombre). Si buscas fieldset, encontrarás esta palabras varias veces, pero esto es exactamente lo que estamos buscando:

<fieldset class=”formbox-field

El primero seguido por: class=  

Lo reconocerás ya que la etiqueta incluirá el nombre del campo tal y como se muestra en la imagen arriba.

  1. Haz los cambios siguientes: Antes de la etiqueta <fieldset agrega lo siguiente (si te es más fácil copia y pega):

<table><tr><td>

  1. Listo, cierra la etiqueta añadiendo al final:

</td>

Para identificar el final busca </fieldset>.

  1. Dirígete al campo siguiente y añade antes de la etiqueta:

 <td> 

  1. Si tienes añadido el campo apellido, añade al principio <td> y cierra con </td>
  2. Al final del último campo añadido cierra con las etiquetas siguientes:

 </td></tr></table>

  1. Observarás en la pantalla derecha que tu formulario ahora es horizontal. Por último deberás borrar la etiqueta width.
  2. Nuevamente dirígete a la barra de búsqueda y escribe width. Esto es exactamente lo que buscamos y debemos borrar:

width: 320px

Cuando lo encuentres, borra la etiqueta del código, ten precaución de no borrar nada más.

De esta forma se debe ver tu código al finalizar:

En la imagen resaltamos en azul las etiquetas añadidas. Además el atributo width ya no se encuentra dentro del código y el formulario está en formato horizontal.

  1. El formulario está listo, selecciona y copia todo el código nuevamente y pégalo en tu sitio web.

Si eres más visual, puedes ver el video a continuación con los pasos guiados gráficamente para la configuración de tu formulario compacto horizontalmente.

 

 

Regresar al inicio

FORMULARIO EMERGENTE (POP-UP)

Este formulario aparecerá de repente y de forma automática cuando un prospecto visite tu página, dejando ver una ventana de invitación a recibir tus campañas.

A continuación te damos los pasos para utilizar esta herramienta:

  1. Inicia sesión en tu cuenta de Benchmark.
  2. Haz clic en Formularios de registro.
  3. Then, click on the Create New Signup Form button on the right-side of the page.
  4. Haz clic en el botón CREAR UN FORMULARIO.
  5. Selecciona FORMULARIO EMERGENTE (POP-UP) y haz clic en Siguiente.
  6. Haz clic en Guardar y siguiente.
  7. Crea y edita tu formulario de registro.
      • En el botón Configuración Opt-in, tendras las opciones de confirmación, como email de confirmación y páginas de destino.
      • Puedes cambiar la apariencia de tu formulario además de agregar los campos que necesites.
  8. Al terminar haz clic en Guardar y publicar.

Considera lo siguiente:

  • El formulario emergente por defecto es de 400px de ancho con una sangría a la izquierda y a la derecha de 40px. El tamaño máximo del área que puede ocupar una imagen dentro del formulario es de 320px. De cualquier forma, la imagen se ajustará al espacio dado en el formulario.

Qué puedes personalizar del formulario emergente

Este es nuestro formulario más personalizable, incluso una vez que un visitante se haya registrado, puedes personalizar la notificación de éxito.

  • Elige la posición del formulario, la más elegida es al centro.
  • Especifica el ancho del formulario
  • !Añade animación! El formulario puede aparecer desde la izquierda, la derecha, arriba, abajo, expandirse o desvanecerse.
  • La demora se refiere al tiempo que se dejará pasar al usuario visitando la página hasta que aparezca el formulario. Esta demora puede ser de hasta 60 segundos.
  • Similar a los otros formularios también puedes personalizar, color, borde, radio de esquina, y para este formulario, sombra, opacidad y tamaño.
  • Los visitantes pueden cerrar la ventana del formulario si no están interesados. Además puedes personalizar el icono de cerrar.
  • La cobertura por defecto será de color negro y un 70% de opacidad. Esta cobertura se refiere al fondo debajo del formulario que difuminará la vista de la página para darle importancia al mismo formulario. Si esta cobertura no te es necesaria también puedes desactivarla, considera antes que esta cobertura dará un mayor impacto visual a tu formulario.
  • Haz clic en el formulario para agregar imágenes, texto, espacios, encabezados, campos y el botón de registro.
  • Haz clic en el botón suscribirse para modificar la notificación de éxito.

A continuación te mostramos algunos formularios emergentes realizados con la herramienta de formularios de Benchmark.

Regresar al inicio

 

¿El formulario aparece más de una vez a los usuarios ya registrados?

El formulario por defecto aparecerá cuando un visitante no ha iniciado sesión. Una vez que el visitante se haya registrado, el formulario dejará de aparecer. De cualquier forma, si el usuario ha borrado cookies o caché recientemente o se encuentra usando la herramienta en modo incógnito, es formulario aparecerá de nuevo.

Cómo lograr que tu formulario aparezca solo una vez a los visitantes.

  1. En el paso Diseño de tu formulario de registro, haz clic en el botón Configuración global.
  2. Elige la opción Cerrar.
  3. Ahora, activa la casilla Mostrar el popup una vez a los visitantes.
  4. Continúa con el diseño de tu formulario y al final no olvides hacer clic en Guardar y publicar.

Si el mismo formulario está siendo usado en diferentes páginas, la misma regla de aparecer solo una vez aplicará para todo.

 

Regresar al inicio

 

FORMULARIO CLÁSICO
  • Antes de comenzar toma en cuenta lo siguiente:
  • El formulario clásico es un formulario usado en la interfaz antigua.
  • El formulario integrado ha reemplazado al formulario clásico
  • Si ya has trabajado con formularios clásicos, podrás duplicarlos. Sin embargo, no serás capaz de crear nuevos.
  • El formulario clásico está disponible en la interfaz antigua.

Regresar al inicio

 

Cómo crear un formulario que cumpla con el RGPD

Añadir una casilla de verificación para cumplir con el RGDP es un proceso de dos pasos:

  • Edita un campo de tu lista de contactos
  • Añade una casilla de verificación

Campo extra en tu lista de contactos

  1. Crea una nueva lista, la cual deberá estar vinculada a tu formulario de registro más adelante.
  2. Busca la lista desde el menú contactos y haz clic en Editar.
  3. Ahora, puedes ver todos los campos de tu lista. Selecciona uno de los campos extra y cambia su nombre, puedes llamarlo por ejemplo: Política de Privacidad.
  4. Cambia el tipo de campo a Verdadero / Falso. De esa manera se registrará la aceptación o negativa de cada usuario.

 

Una vez que el campo ha sido editado, necesitamos crear un formulario de registro que cumpla con el RGPD.

Añadiendo la casilla de verificación al formulario de registro:

Para efectos del RGPD puedes usar el formulario integrado o el formulario emergente.

  1. Crea un nuevo formulario. Puedes utilizar el Formulario Clásico o Emergente.
  2. En el paso 1 selecciona la lista creada con el campo editado.
  3. En el segundo paso de la creación del formulario, añade el campo que previamente editaste haciendo clic en los tres puntos a un lado de los campos.
  4. En la misma ventana haz clic en el campo y puedes cambiar el nombre de la etiqueta si gustas y el texto del campo. En la opción Tipo cambia a Verificación.
  5. Marca este campo como Requerido.
  6. En la opción Respuesta añade el código a continuación: <a target=”blank” href=”https://www.aquivatupoliticadeprivacidad.com”><u>Privacy Policy</u></a>

Continúa con la edición del formulario y haz clic en Guardar y publicar al terminar.

Nota:

  • El enlace href mencionado en el paso 6 debe ser sustituido por tu política de privacidad.
  • Los formularios compactos no son aptos para añadir esta casilla de verificación del RGPD.

Si necesitas más información te invitamos a ver el siguiente video:

  • El formulario integrado se encuentra disponible únicamente en la nueva interfaz.

 

Regresar al inicio

Importante:

Si tienes conocimiento de CSS puedes agregar un toque adicional a tus formularios.

Si tienes preguntas adicionales sobre las herramientas de Benchmark, contacta a nuestro equipo de soporte vía email, livechat o teléfono.


¿Te ha resultado útil esta información?
¡Ya has votado!

¿No encuentras lo que buscas?

Crea un ticket