Sección de pagos y donaciones

Los formularios de pago eliminan la molestia de aceptar pagos en línea con Stripe y PayPal. Reciba pagos y donaciones en minutos. Vende productos, servicios, cursos online y mucho más.

Puede crear fácilmente una página de pago o donación en su página web página para aceptar una donación o un pago único usando el Pago y donación .

También le brinda la posibilidad de configurar los campos de formulario que desea en su formulario y le permite especificar una dirección de correo electrónico a la que se envían por correo electrónico los datos del formulario recopilados.

Todos los datos del formulario también se almacenan y son accesibles en el Configuración > Envíos de formularios sección del estudio. Más información.

Todos los datos enviados a través del formulario de contacto también se reenviarán a la identificación de correo electrónico especificada en la configuración del formulario de contacto. Su cuenta de correo electronico se toma como predeterminado.
También verifique: Cambiar la dirección de correo electrónico de la cuenta. 


En este artículo hablaremos de:

  1. Agregar sección a una página
  2. Contenido
  3. Diseño
  4. Administrar formulario
  5. DE ESTILO RESORT
  6. Configuración
  7. Notificación Por Correo Electrónico:
  8. Consultar pagos y métodos de pago
  9. Ejemplo vivo

Agregar una sección de pagos y donaciones

  • Se puede agregar una sección a una página. Puede agregar una sección a una página ya existente o crear una nueva página dentro de su sitio web.
  • En tu pagina, Haga clic en el azul + icono para agregar un Nueva sección a tu página.

 

  • Ahora verá el categorías de sección en el lado izquierdo.
  • Elija el Forms (1) categoría y haga clic en el Pagos y donaciones pestaña (2) donde puede elegir diferentes diseños de Pagos y donaciones (3) sección.

  • Elija cualquier diseño de sección y haga clic en él para agregarlo a su página.

Administrar formulario de pago

  • Haga clic en Editar formulario de pago Botón (1).

  • Tendrás la opción de gestionar Contenido (2) Diseño (3) Formulario (4) DE ESTILO RESORT (5) Configuración (6), y Correo electrónico de éxito (7).
  • Cuando haya terminado, haga clic en Guardar (8) aplicar los cambios al formulario.


Contenido

  • Subir una imagen (1) para el formulario.
  • Agregue un Título (2)y Descripción (3) para el formulario. Antes de añadir la descripción, compruebe este vídeo .

  • Especifica el Título de la sección (4) para la sección Formulario de Pago.


Administrar el diseño

  • Haga clic en el elemento Editar formulario de pago Botón (1).

  • Elija el Diseño (2) pestaña.
  • Seleccione la Forma para diseño para su sección (3) y Guardar (4) los cambios.


Administrar formulario

Una vez que haya agregado la sección: 

  • Haga clic en el elemento Editar formulario de pago Botón (1).

  • Abra la Formulario (2) pestaña. Una vez que haya terminado de realizar los cambios, Guardar (3) la configuración.

Administrar campos de formulario

En Administrar campos de formulario, puede especificar los campos que desea que los visitantes completen en este formulario.

  • Haga clic en Agregar nuevo campo (1) botón para agregar más campos a su formulario.
  • Editar o Eliminar (2) un campo ya agregado.
  • Arrastrar y soltar (3) el campo para cambiar la secuencia en el formulario.

  • Al hacer clic en el + Agregar campo Se abrirá una ventana emergente desde donde puede elegir los campos de su formulario.

  1. Capturar el nombre de tu cliente
  2. Capture cualquier pequeña información a través del Texto corto .
  3. Capture cualquier información/mensaje elaborado a través del Texto largo .
  4. Capturar el o enviar un email. de tu cliente
  5. capturar cualquier información numérica de tu cliente
  6. Agregue servicios para elegir en un desplegable .
  7. Selección única: Agrega una selección de radio para tus servicios.
  8. Selección múltiple: Agregue un campo de casilla de verificación para selecciones múltiples.
  9. Agregue un selector de fechas para que tus clientes puedan elegir fecha para cualquier evento.
  10. Agregue un línea entre los campos del formulario.
  11. Capturar el de facturación de tu cliente
  12. Capturar el sitio web de tu cliente
  13. Capturar el teléfono número de tu cliente
  14. Agregue un time para que sus clientes puedan especificar la hora del evento ellos mismos.
  15. Agregue un separador entre los campos del formulario.
  16. El campo de consentimiento La opción se puede usar para obtener permisos para los boletines, aceptando la privacidad y los términos de uso.
  17. Toma las reseñas de los clientes usando el estrella escala, escala numérica y escala sonriente.

Nota:

Los campos de correo electrónico y cantidad son campos obligatorios y no se pueden eliminar.


Actualizar cantidad y forma de pago

Cantidad de actualización

  • En Administrar campos de formulario (1) tienes la opción de fijar la cantidad que quieres cobrar a través del formulario.
  • Haga clic en el elemento Editar (2) junto a Monto.

  • Tendrá la opción de configurar el campo del formulario Título y descripción.
  • Haga clic en Botón Agregar nueva cantidad para agregar una nueva cantidad.
  • También puede arrastrar y soltar los campos de cantidad para cambiar la secuencia.
  • Agregue un Etiqueta por la cantidad
  • Verifique la opción de Habilitar cantidad definida por el usuario para permitir a los usuarios agregar cualquier cantidad.
  • Guardar tus cambios

Ver en acción:


Método de Pago

  • Puede actualizar los métodos de pago para el formulario.
  • Puedes elegir entre Paypal y Stripe. Los clientes indios también pueden agregar Razorpay y PayUMoney Más información.

Nota:

A la vez, solo se puede conectar un método de pago con un formulario.


Envíos de Formularios

  1. Tienes la opción de elegir enviar el formulario de consultas a su correo.
  2. Especifique hasta 3 direcciones de correo electrónico a las que este formulario de pago debe enviar datos. Su cuenta de correo electronico se toma como predeterminado cuando agrega el formulario. Descubre cómo para agregar direcciones de correo electrónico.
    También verifique: Cambiar la dirección de correo electrónico de la cuenta.
  3. Enviar a Hojas de cálculo de Google por lo que los datos del formulario se agregarán directamente a su hoja de Google. Más información.
  4. Exportar datos de formulario como archivo CSVMás información.


Opciones de estilo

  • Haga clic en Editar formulario de pago (1) botón.

  • Elija el  DE ESTILO RESORT (2) pestaña.
  • Cambie el estilo de los elementos de la sección y Guardar (3) sus cambios.

El estilo es un aspecto importante para crear una experiencia visualmente atractiva y fácil de usar.

Tendrá múltiples opciones de estilo para la sección: 


Campos de formulario

Pixpa permite piensa a fully personalizan las apariencia of su formulario campos. Estos estilo opciones aplicar a todas Las opciones de entrada campos in su Pago Formulario y give piensa mayor control más del cómo su formulario miradas y se siente on su sitio web.

  1. Forma: Elija la forma de sus campos de entrada (como rectángulo, redondeado, píldora o texto) para que coincida con la estética de su sitio web.
  2. Llenar: Habilite este interruptor para aplicar un color de relleno de fondo a sus campos de formulario.
  3. Color de base:Establece el color de fondo de los campos cuando la opción de relleno está habilitada.
  4. Esquema: Activa o desactiva el borde (contorno) para cada campo.
  5. Color del contorno: Elija el color del borde del campo cuando el contorno esté habilitado.
  6. Color del texto del campo: Establezca el color del texto escrito por los usuarios dentro de los campos del formulario.
  7. Altura: Ajuste la altura de sus campos eligiendo entre: Pequeño, Mediano, Grande o Extra Grande.
  8. Etiquetas: Elija si las etiquetas de los campos de formulario aparecerán dentro o fuera del campo.
  9. Color de etiqueta:Define el color de las etiquetas cuando se colocan fuera del campo.
  10. Color interior de la etiqueta:Establezca el color para las etiquetas colocadas dentro del campo (útil para etiquetas de estilo marcador de posición).
  11. Espaciado entre campos: Utilice el control deslizante para establecer el espaciado vertical (en píxeles) entre cada campo del formulario.


Alineación

  • Administre la alineación del contenido del formulario horizontalmente desde Alineación horizontal (1).
  • Administre la alineación del contenido del formulario verticalmente desde Alineamiento vertical (2).


Texto

  • Haga clic en el elemento Cambiar estilo de texto (1) botón para visitar el Diseño sección y administre sus tamaños y estilos de fuente. 
  • Especifica el Título (2) estilo de fuente del formulario.
  • Especifica el Descripción (3) estilo de fuente del formulario.


Espaciado

  • Especifica el Ancho de imagen (1) de la imagen en forma de Porcentaje.
  • Especifica el Espacio entre imagen y texto (3) en porcentaje.
  • Especifica el Espacio debajo del título (4) en porcentaje.


Titular

  1. Alinear horizontalmente El texto del título de la sección. Puede configurarlo a la izquierda, al centro o a la derecha.
  2. Habilitar/Deshabilitar el Divisor entre el título de la sección y el contenido de la sección.
  3. Configure Grosor del divisor (en píxeles).
  4. Especifica el Color del divisor del selector de color.
  5. Elija un Estilo divisor desde el desplegable.
  6. Configure Ancho del titular para definir qué tan ancho aparecerá el título de la sección, comenzando desde un mínimo del 50%.
  7. Especifica el Espacio debajo del título dentro de la sección (en px).


Imágenes

  1. Recorte de imagen: Elija el Icultivo de mago para los elementos de la lista. Puede configurar las imágenes como Cuadrado, Círculo, Horizontal, Retrato y Original.
  2. Radio de esquina: Elija tener un radio de esquina común o un radio de esquina diferente para cada lado de los elementos de la lista y establezca un número (en px) para el CRadio interior de las imágenes de elementos de la lista. Conozca más.
  3. Animación al pasar el cursor: Elija Animar la imagen de la sección al pasar el mouse, habilitando el interruptor. Verifique esta característica en una página en vivo.
  4. Estilo de animación: Elija una Estilo de animación para la imagen cuando el cursor pasa sobre ellas.
  5. Máscara de forma: Active este interruptor para aplicar una máscara de forma a las imágenes de la sección Lista de imágenes. Una vez activado, la forma seleccionada se ajustará visualmente a la imagen.
  6. Seleccionar forma: Elige entre varias formas predefinidas para aplicarlas a tus imágenes. Esto te permite estilizar tu contenido de forma creativa mostrando imágenes con formas únicas, como redondeadas, en forma de diamante, en forma de gota, etc.

Tip

Usando el radio de esquina campo, puede crear diferentes formas de imágenes de elementos de lista. En caso de que especifique 500 px aquí, las imágenes se mostrarán en forma de círculo.

  • En caso de que haya elegido esquinas divididas, puede establecer un radio de esquina diferente para cada esquina.


borde de la imagen

  1. Activar/Desactivar borde alrededor de la imagen cambiando el interruptor.
  2. Elige tener un frontera común en todos los lados de la imagen o puede especificar el fronteras por separado para cada lado.
  3. Especifica el el ancho de la frontera. Si se establece en 0, el borde no aparecerá. También tiene la opción de establecer el ancho del borde individualmente para cada lado de la imagen.
  4. Seleccione la Forma para Color del borde del selector de color.
  5. Seleccione un preferido Estilo de Borde desde el desplegable.
  6. Determina el ancho de borde para movil dispositivos, alineándolo con el ancho elegido para escritorio.


Estas opciones de estilo son para el botón emergente, donde se abrirá el formulario de Pago cuando se haga clic en el botón.

  1. Tamaño del botón – Seleccione el tamaño del botón entre opciones como pequeño, mediano o grande.
  2. Espacio encima del botón – Ajuste el espaciado vertical sobre el botón (en porcentaje).
  3. Estilo de botón – Elija el estilo del botón, como predeterminado o personalizado.
  4. Color del boton - Seleccione el estilo de color del botón. Las opciones son Predeterminado, Invertir o Personalizado.
  5. Texto del botón – Personaliza el color del texto del botón.
  6. Fondo del botón – Seleccione el color de fondo para el botón.


Botón de formulario

Estas configuraciones permiten personalizar el botón de envío de formulario para que coincida con el diseño y la disposición de la página.

  1. Tamaño del botón – Seleccione el tamaño del botón (Pequeño, Mediano o Grande).
  2. Espacio encima del botón – Ajuste el espaciado vertical sobre el botón (especificado en porcentaje).
  3. Estilo de botón – Elija el estilo general del botón, como Predeterminado o Personalizado.
  4. Color del boton - Establezca el estilo de color del botón. Las opciones son Predeterminado, Invertir o Personalizado.
  5. Texto del botón – Personaliza el color del texto que se muestra en el botón.
  6. Fondo del botón – Seleccione un color de fondo para el botón.
  7. Alineación de botones – Elija la alineación del botón (Izquierda, Centro o Derecha).
  8. Ancho del botón – Ajusta el ancho del botón. Las opciones son: Predeterminado, Grande, Extragrande o Ancho completo.


Botones de título

Estas configuraciones controlan la apariencia y el espaciado de los botones colocados con el título de la sección.

  1. Tamaño del botón – Seleccione el tamaño general de los botones (Pequeño, Mediano o Grande).
  2. Espacio entre botones – Ajuste el espacio entre varios botones (medido en vw).
  3. Espacio encima de los botones – Establezca el espaciado vertical sobre los botones (medido en porcentaje).
  4. Ancho del botón – Elige el ancho de los botones. Las opciones incluyen: Predeterminado, Grande, Extragrande y Ancho completo.
  5. Tamaño del enlace de texto – Especifique el tamaño de fuente de los enlaces de texto asociados con los botones (medido en px).
  6. Tamaño del botón de imagen – Ajusta el tamaño de los botones basados ​​en imágenes (medido en px).


Íconos sociales de titulares

Muestra y personaliza los íconos para compartir en redes sociales en el formulario.

  1. Tamaño del icono – Ajusta el tamaño de los íconos sociales (medido en px).
  2. Tipo de icono – Elija el estilo de los íconos, como las opciones Clásico, Sólido o Contorno.
  3. Color del icono – Selecciona el color de los íconos. Las opciones incluyen Texto del enlace, Personalizado o Color de la marca (color original de la red social).
  4. Color de fondo del icono – Establezca un color de fondo personalizado para los íconos para mejorar la visibilidad y el estilo.



Configuración

  • Puede optar por mostrar el formulario completo en la página o como una ventana emergente vinculada a un botón de llamada a la acción.
  • Elija el comportamiento del formulario de la Mostrar formulario como opcion 1).

  • Formulario en línea: El formulario se agregará directamente a la página.
  • Formulario emergente: el formulario se abrirá en una ventana emergente haciendo clic en el botón de llamada a la acción.
  • Configure  Etiqueta de botón de llamada a la acción (2) para el formulario.
  • Elija el tamaño del botón (3) de Pequeño, Mediano y Grande.
  • Elija el estilo de botón (4) desde Sólido, Contorno y Enlace de texto.
  • Invertir (5) el color del botón. El color predeterminado se aplicará desde el Botones y enlaces opción en la sección Diseño.
    También verifique: Estilo de botones y enlaces.
  • Elija el alineación de botones (6) desde la izquierda, el centro y la derecha.

  • Especifique el formulario Titular (7), en su caso.

  • Este título se usa solo en el formulario emergente.

Acción posterior al envío

Como acción posterior al envío, puede optar por mostrar mensajes de éxito (1) o redirigir a cualquier otra página (2).

En caso de mostrar mensajes de éxito:

  • Especifica el Éxito posterior al pago (2) mensaje que se muestra después de que el usuario envía el formulario.
  • También puede agregar cualquier script en el HTML de éxito posterior al pago (3) .

  • En caso de Rredirigir a URL, puede especificar cualquier página interna/externa haciendo clic en el icono de configuración (🟐). Conozca más.


Notificación Por Correo Electrónico:

Desde aquí, puede personalizar el asunto del correo electrónico para las notificaciones que recibe como propietario de un sitio web cuando envía un formulario correctamente. Además, puede personalizar el correo electrónico de confirmación que se envía a los usuarios o clientes después de que envían el formulario y realizan un pago.

  • Especifica el Asunto del correo electrónico de envío del formulario de pago. También puede incluir {SITIO WEB} Variable para incluir el nombre del sitio web. Esto resulta útil cuando tienes varios sitios web.

  1. Habilitar/Deshabilitar el correo electrónico de éxito.
  2. Especifica el Asunto del correo electrónico de éxito.
  3. Agregue un cuerpo del correo electronico al correo electrónico de éxito. Puede agregar las variables en el cuerpo del correo electrónico que se capturarán y enviarán en el correo electrónico {TRNSACTION_ID}, {AMOUNT} y {NAME}.

Nota:

El correo electrónico al cliente es una función premium disponible solo en Profesional y Avanzado planes. Más información. 


Verificar pagos y agregar método de pago

  • Vaya a la Pagos y Donaciones (1) .
  • Aquí puede ver todos los pagos que ha recibido.
  • Asegúrate de leer fecha, cantidad recibida y correo electrónico (2) del pago.
  • Haga clic en cualquier envío de formulario (3) para ver los detalles de la transacción del pago.
  • Verifique los detalles de la transacción como Id. de transacción, nombre, método de pago utilizado e Id. de transacción del método de pago del cajón derecho.
  • Exportar todos los detalles de pago en un formato CSV (4).


Añadir método de pago

  • Vaya a la Configuración sección (1) y haga clic en el Aceptar pagos opción (2) del menú de la izquierda.
  • Ahora, verifique los métodos de pago activos e inactivos.
  • Haga clic en Botón habilitar (3) para habilitar un método de pago y viceversa.
  • Conecta Stripe or Negocio Paypal. Los clientes indios también pueden habilitar PayUMoney or Razorpay.

Nota:

Pago y Donaciones es un Función premium y solo está disponible en el Planes Profesional y Avanzado.


Aquí hay un formulario de pago/donación en vivo: 

Ver un sitio de demostración en vivo

Nota:

Para reducir los spammers en el formulario, la seguridad captcha de Google se habilita automáticamente en su formulario.


¿No encuentras lo que buscas?

Póngase en contacto con un Experto Pixpa.