16
Una guía rápida para... Crear Formularios Web Personalizados En esta guía... Aprenda a diseñar formularios web artísticos en sólo unos cuantos segundos. Elija su plantilla favorita y después dele color y forma a cada aspecto de su formulario hasta que obtenga lo que necesite!

Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

Embed Size (px)

Citation preview

Page 1: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

Una guía rápida para...

Crear Formularios Web Personalizados

En esta guía...Aprenda a diseñar formularios web artísticos en sólo unos cuantos segundos. Elija su plantilla favorita y después dele color y forma a cada aspecto de su formulario hasta que obtenga lo que necesite!

Page 2: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

Contenido1. Crear un nuevo formulario web! 4

1.1 Iniciar el Generador de Formularios Web ! 4

1.2 Elegir la Plantilla! 4

1.3 Tipo de Formulario! 4

2. Editar la apariencia del formulario! 52.1 Apariencia del Cuerpo del Formulario! 5

2.2 Apariencia del encabezamiento y pie de página! 5

2.3 Contenido del encabezamiento y pie de página! 5

2.4 Apariencia de los campos de entrada! 6

2.5 Apariencia del “botón enviar” ! 6

2.6 Etiqueta del “botón enviar” ! 6

2.7 Apariencia de la etiqueta de campo! 7

2.8 Apariencia de Enlaces! 7

2.9 Apariencia del texto general! 7

2.10 Apariencia del contador del formulario ! 7

2.11 Apariencia de la declaración de privacidad! 8

2.12 Muestre y oculte sus componentes! 8

2.13 Añadir texto! 8

2.14 Añadir divisor! 8

2.15 Añadir imagen! 9

2.16 Cambie el tamaño del formulario! 9

3. Añadir campos personalizados! 103.1 Añadir campos populares! 10

3.2 Añadir campos existentes personalizados! 10

3.3 Organizar los campos! 10

3.4 Editar los campos! 10

3.5 Añadir nuevos campos personalizados! 11

3.6 Elegir un tipo de campo! 11

3.7 Ingresar valores predefinidos! 11

Ajustes de Formularios web! 124.1 Nombre del formulario web ! 12

4.2 Consentimiento Confirmado! 12

Crear Formularios Web Personalizados

2

Page 3: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

4.3 Página de agradecimiento predeterminada! 12

4.4 Página de agradecimiento personalizada! 12

4.5 Permanecer en la página actual! 13

4.6 Ajustes avanzados! 13

5. Publicar formulario! 145.1 Instalar el formulario web usted mismo! 14

5.2 Haga que su diseñador web instale el formulario! 14

5.3 GetResponse alojará mi formulario web ! 14

6. Lista de Formularios Web! 156.1 Editar un formulario web ! 15

6.2 Editar Ajustes del Formulario! 15

6.3 Ver fuente! 15

Ayuda e Información! 16

Crear Formularios Web Personalizados

3

Page 4: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

1. Crear un nuevo formulario web1.1 Iniciar el Generador de Formularios Web

Inicie la sesión en su cuenta. Vaya a Formularios Web en la barra de menú y dele un clic a Crear nuevo. El editor de formularios web se iniciará.

Elija la campaña para capturar contactos en la parte superior derecha de la página.

1.2 Elegir la Plantilla

Primero, usted debe elegir una plantilla para su formulario web. Usted podrá ver las plantillas más nuevas en la parte superior de la página.

Dele un clic a la pestaña de categorías para elegir plantillas con más de 20 categorías de diferentes industrias tales como de mercadotecnia, viajes, entretenimiento, finanzas, bienes raíces y muchas más.

Dele un clic a la plantilla que usted prefiera y una vista previa aparecerá. Elija un esquema de color que coincida o haga juego con su página web y dele un clic en aplicar. La plantilla aparecerá en el espacio inferior de edición.

1.3 Tipo de Formulario

De la barra de herramientas del editor, elija tipo de formulario de la lista desplegable. A la derecha, usted podrá elegir entre un formulario incrustado en su página web, uno que tendrá una ventana emergente en su página web o un lightbox que oscurecerá su página web cuando el formulario aparezca.

Crear Formularios Web Personalizados

4

Page 5: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

2. Editar la apariencia del formulario2.1 Apariencia del Cuerpo del Formulario

De la lista desplegable, elija cuerpo. La barra de herramientas le presentará opciones para cambiar la apariencia del cuerpo, incluyendo el color de fondo y el estilo de los bordes.

Dele un clic en mostrar opciones avanzadas si desea ingresar el URL para una imagen de fondo personalizada. La posición de la imagen así como el tipo de repetición pueden ser seleccionados.

2.2 Apariencia del encabezamiento y pie de página

De la lista desplegable, elija encabezamiento o pie. La barra de herramientas le proporcionará opciones para cambiar la apariencia, incluyendo el color de fondo y el estilo de los bordes.

Dele un clic en mostrar opciones avanzadas si desea ingresar el URL para una imagen personalizada. La posición de la imagen así como el tipo de repetición pueden ser seleccionados. Cambie los valores de relleno para incrementar el espacio alrededor del contenido del encabezamiento o del pie de página.

2.3 Contenido del encabezamiento y pie de página

Dele un clic en editar encabezamiento o en editar pie de página a la izquierda de la vista previa.

Utilice el editor pequeño que aparece para cambiar el texto, el estilo de fuente del contenido del encabezamiento y del pie de página, y para justicar el texto. Dele un clic en aplicar para guardar los cambios.

Crear Formularios Web Personalizados

5

Page 6: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

2.4 Apariencia de los campos de entrada

De la lista desplegable, elija Entradas. La barra de herramientas presentará opciones para cambiar la apariencia de los campos de entrada incluyendo el estilo y el color de la fuente.

Dele un clic en mostrar opciones avanzadas para cambiar el color, estilo de bordes y el tamaño de los campos

2.5 Apariencia del “botón enviar”

De la lista desplegable, elija el Botón enviar. La barra de herramientas le presentará opciones para cambiar la apariencia del botón, incluyendo el estilo de fuente, el color, el fondo y la posición del botón.

Dele un clic en mostrar opciones avanzadas para cambiar el color y el estilo de bordes del botón.

2.6 Etiqueta del “botón enviar”

Dele un clic en editar a la izquierda del botón de vista previa.

En la ventana que aparece, ingrese la etiqueta de su botón preferido y dele un clic en aplicar.

Crear Formularios Web Personalizados

6

Page 7: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

2.7 Apariencia de la etiqueta de campo

De la lista desplegable, elija etiquetas. La barra de herramientas le presentará opciones para cambiar el texto de la etiqueta de campo, incluyendo estilo de fuente, color así como la posición de la etiqueta.

2.8 Apariencia de Enlaces

De la lista desplegable, elija enlaces. La barra de herramientas le presentará opciones para cambiar la apariencia de cualquier enlace que usted haya añadido a los contenidos del formulario.

2.9 Apariencia del texto general

De la lista desplegable, elija Texto. La barra de herramientas le presentará opciones para cambiar la apariencia del texto general del formulario.

2.10 Apariencia del contador del formulario

De la lista desplegable, elija Contador. La barra de herramientas le presentará opciones para cambiar la apariencia del contador, incluyendo el estilo de fuente, color y posición.

El contador muestra el número de suscriptores para esta campaña. Dele un clic en editar para cambiar el texto y el estilo.

Crear Formularios Web Personalizados

7

Page 8: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

2.11 Apariencia de la declaración de privacidad

De la lista desplegable, elija Privacidad. La barra de herramientas le presentará opciones para cambiar la declaración de privacidad, incluyendo el estilo de fuente, color y posición.

La declaración de privacidad les asegura a los contactos que no se hará mal uso de la información que ellos otorguen. Dele un clic en editar para cambiar el texto.

2.12 Muestre y oculte sus componentes

En la parte inferior de la vista previa del formulario, dele un clic en habilitar componentes, incluyendo el encabezamiento, pie de pagina, nombre de campo, contador de suscriptores, declaraciones de privacidad y de “desarrollado por” (“powerered by”).

2.13 Añadir texto

En la parte superior de la vista previa del formulario, dele un

clic en el botón de añadir texto. Un nuevo campo de texto aparecerá en el formulario. Dele un clic en editar para ingresar el texto y cambiar la apariencia incluyendo el estilo de fuente, color y justificación del texto. Arrastre el campo de texto a su posición preferida dentro del contenido del formulario.

2.14 Añadir divisor

En la parte superior de la vista previa del formulario, dele un

clic en el botón de añadir divisor. Un nuevo divisor aparecerá en el formulario. Dele un clic en editar para elegir la altura, estilo de borde y color preferido de su divisor.

Crear Formularios Web Personalizados

8

Page 9: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

2.15 Añadir imagen

En la parte superior de la vista previa del

formulario, dele un clic en el botón de añadir imagen. Una imagen de muestra aparecerá en el formulario. Dele un clic en editar para ingresar el URL de su propia imagen y elija la posición de preferencia dentro del formulario.

2.16 Cambie el tamaño del formulario

A la derecha de la vista previa del formulario, dele un clic y arrastre el botón de cambiar tamaño para cambiar el ancho.

Crear Formularios Web Personalizados

9

Page 10: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

3. Añadir campos personalizados3.1 Añadir campos populares

A la derecha de la vista previa del formulario, varios campos populares se mostraran incluyendo dirección, estado/provincia, código postal y ciudad.Para añadir alguno de estos campos a nuestro formulario web, simplemente arrastre y suelte el campo dentro de la vista previa.

3.2 Añadir campos existentes personalizados

A la derecha de la vista previa del formulario,una lista de sus campos personalizados existentes se mostrará. Para añadir cualquiera de estos campos a su formulario, simplemente arrastre y suelte el campo dentro de la vista previa.

3.3 Organizar los campos

Para cambiar el orden de los campos en su formulario web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia.

3.4 Editar los campos

Para cambiar un campo, ponga el cursor del mouse sobre el campo y dele clic en editar que se encuentra del lado izquierdo.

En la ventana que aparece, usted puede cambiar la etiqueta del campo y ver el nombre personalizado asignado.

Seleccione la casilla de verificación si usted desea hacer el campo obligatorio. Elija entre varios tipos de campos dependiendo del tipo de respuesta que usted requiere. Un valor predeterminado también puede ser ingresado.

Crear Formularios Web Personalizados

10

Page 11: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

3.5 Añadir nuevos campos personalizados

En la parte superior del espacio de edición, dele

un clic en el botón de añadir nuevo campo.

Elija una etiqueta para el campo personalizado.

3.6 Elegir un tipo de campo

Campo de Texto (opción única) le permitirá a los contactos ingresar su propia respuesta. Sin embargo, usted puede ingresar un valor predeterminado.

Lista de Radio (opción única) le permitirá ingresar respuestas predefinidas para que los contactos elijan el valor más apropiado.

Lista de casillas de verificación (opciones multiples) le permitirá ingresar valores predefinidos de los cuales los contactos podrán seleccionar uno o más.

Menú (opción única) y menú (opciones múltiples) le ahorrarán espacio en su formulario mostrando sus valores predefinidos en la lista desplegable.

Casilla de Texto le proveerá más espacio para que los contactos escriban su propia respuesta.

3.7 Ingresar valores predefinidos

Si elije una lista de radio, de casillas de verificación o de menú como su tipo de campo, usted debe ingresar los valores que sus contactos elegirán.

Ingrese cada valor dentro de la casilla y dele clic al botón con el signo de más que se encuentra a la derecha. Los valores aparecerán en la parte inferior.

Dele un clic en elegir para hacer que un valor sea el predeterminado.

Para eliminar un valor, ponga el cursor sobre este y dele clic en el botón con una “X” a la derecha.

Crear Formularios Web Personalizados

11

Page 12: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

4. Ajustes de Formularios webCuando usted termina de diseñar el formulario web, dele clic a siguiente paso. La página de los ajustes del formulario web aparecerán.

4.1 Nombre del formulario web

Dele un nombre único a su formulario web para que usted lo pueda reconocer en su lista de formularios web.

4.2 Consentimiento Confirmado

Se le recordará en esta página si el consentimiento confirmado esta habilitado en esta campaña. Esto enviará un mensaje de confirmación a cada nuevo suscriptor antes de ser añadidos. El consentimiento confirmado es recomendable, pero esta opción puede ser cambiada en sus ajustes de campaña.

4.3 Página de agradecimiento predeterminada

Por defecto, una pagina de agradecimiento de GetResponse se mostrará para su conveniencia. Una página de agradecimiento dinámica mostrará la información del contacto.

¡Impresione a los nuevos suscriptores añadiendo un rostro y una voz a su página! Elija cualquiera de las opciones anteriores y dele un clic en elegir archivo o fichero para seleccionar una grabación desde el espacio de multimedia.

4.4 Página de agradecimiento personalizada

Elija personalizar página de agradecimiento para ingresar el URL de su propia página donde usted desea que sus contactos sean dirigidos después de que ellos hayan ingresado sus datos.

Crear Formularios Web Personalizados

12

Page 13: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

4.5 Permanecer en la página actual

Elija quedarse en la página actual, si desea que sus contactos ingresen sus datos sin dejar la página que están viendo. Esto sólo causará que el formulario se actualice e indique que los datos fueron ingresados exitosamente.

4.6 Ajustes avanzados

Dele un clic en mostrar datos avanzados en la parte inferior de la página de ajustes.

Usted puede elegir una campaña diferente de donde el formulario capturará sus contactos.

Ingrese un número de referencia para identificar a los contactos que han utilizado este formulario web.

Crear Formularios Web Personalizados

13

Page 14: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

5. Publicar formularioAl terminar de elegir los ajustes del formulario, dele un clic a siguiente paso. La página de publicación del formulario aparecerá.

5.1 Instalar el formulario web usted mismo

Dele un clic en Yo instaleré mi formulario web en caso de que usted mismo lo añada a su página web.

En la parte inferior de la página, copie el código de JavaScript y péguelo en el código de origen de su pagina web.

5.2 Haga que su diseñador web instale el formulario

Dele clic en mi diseñador web instalará mi formulario web si usted mismo no hace dichos cambios.

Ingrese el correo electrónico de su diseñador web, y si desea añadir un mensaje opcional para su diseñador indicándole donde usted desea que añadir el formulario a su página.Dele un clic a enviar a mi diseñador.

5.3 GetResponse alojará mi formulario web

Dele un clic a GetResponse alojará mi formulario web y una dirección de URL aparecerá. Este URL puede usarse para mostrar el formulario web en enlaces de mensajes de foros, en su firma de correo electrónico y en muchos otros lugares.

Crear Formularios Web Personalizados

14

Page 15: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

6. Lista de Formularios WebDele un clic a GetResponse alojará mi formulario web y una dirección de URL aparecerá. Este URL puede usarse para mostrar el formulario web en enlaces de mensajes de foros, en su firma de correo electrónico y en muchos otros lugares.

6.1 Editar un formulario web

Para hacer cambios a la apariencia, contenido o campos de un formulario web, dele un clic en Editar que se encuentra a la derecha del nombre del formulario web y éste se cargará al editor.

Efectúe los cambios que necesite y dele un clic en guardar formulario web en la parte inferior de la página.

Si usted publicó el formulario web utilizando el código javascript, todas las páginas web inmediatamente mostrarán la nueva versión. No hay necesidad de cambiar el código de origen.

6.2 Editar Ajustes del Formulario

Dele un clic en ajustes a la derecha del nombre del formulario para cambiar el tipo de página de agradecimiento y los ajustes avanzados tales como el código de referencia. Dele un clic a guardar el formulario web para actualizar.

6.3 Ver fuente

Para publicar un formulario web existente a un nuevo sitio web, dele clic en ver fuente a la derecha del nombre del formulario. Usted será dirigido al paso de publicación del formulario web para que pueda copiar el código javascript, enviarlos a su diseñador o copiar una dirección URL conveniente que muestre una versión alojada u organizada del formulario por GetResponse.

Crear Formularios Web Personalizados

15

Page 16: Crear Formularios Web Personalizados - GetResponse … web, dele clic a un campo y arrástrelo a una nueva posición de su preferencia. 3.4 Editar los campos Para cambiar un campo,

Ayuda e InformaciónEmpiece dándole un clic en el enlace de Asistencia en la parte superior derecha de la página.

Asistencia de Teléfono Gratis, Correo Electrónico y Chat en VivoContamos con asistencia 6 días de la semana para ayudarle a maximizar GetResponse – para que usted pueda maximizar sus beneficios. Póngase en contacto con nosotros por teléfono, correo electrónico, o chat. La asistencia siempre es gratuita y nuestro equipo es muy amable. Llámenos ahora al: 1-877-362-4547

Tutoriales en Video Paso-a-Paso y creados en base a las necesidades de nuestro clientes. Sabemos que la gente está ocupada y necestia aprender a su propio paso. Por lo cual, ofrecemos tutoriales de diferentes tipos y niveles. Además de contar con instrucciones fáciles de seguir, ofrecemos secciones de Preguntas Frecuentes, definiciones, estudios de casos y mucho más. Y si todavá tiene dudas, estamos sólo a una llamada de distancia!

Centro de Aprendizaje y Base de ConocimientoNuestro Centro de Aprendizaje y nuestra enorme base de conocimiento están disponibles todo el tiempo para brindarle toda la información que necesite y convertir sus ideas en campañas lucrativas. Encuentre artículos, libros blancos, casos de estudio, definiciones, consejos y técnicas. Visite con frecuencia este sitio para que se mantenga informado de lo más reciente en marketing por correo electronic.

Foro En LíneaForme parte de la comunidad en línea de GetResponse y aprenda mientras conoce a personas interesantes. ¿Tiene alguna pregunta acerca de la planeación de su campaña? ¿Segmentación de listas? ¿Campañas por goteo de autorrespuesta? Comparta sus experiencias y sus mejores prácticas y crezca su negocio "con un poco de ayuda de sus amigos de GetResponse".

Blog de GetResponse – Consejos de Marketing de Correo ElectrónicoEl blog de GetResponse se enfoca en la industria de marketing por correo electrónico y de autorrespuesta. Proporciona asesoría, consejos de mercadotecnia, investigaciones de marketing por correo electrónico y otros.

Crear Formularios Web Personalizados

16