Checkout - Formulario

¿Qué es el formulario de checkout?

El formulario de checkout es la pantalla que ven tus compradores cuando finalizan una compra en tu tienda web. Es donde proporcionan su información de envío, datos de facturación y comprobante de pago.

Tú tienes control total sobre qué información solicitar. El formulario se construye mediante un sistema de bloques y campos que puedes personalizar según las necesidades de tu negocio.

Cómo acceder al formulario

Desde el menú lateral izquierdo, expande la sección Checkout (reporte de pago) y haz clic en Formulario.

Menú lateral: Checkout > Formulario

Vista general

Al ingresar verás el formulario tal como está configurado actualmente. La estructura se organiza en bloques (secciones) que contienen campos (inputs que el comprador debe llenar).

Formulario de checkout con bloques y campos configurados

En la parte superior encontrarás el botón "Nuevo bloque" para agregar secciones adicionales. Cada bloque se muestra con su título, y dentro de él los campos con sus respectivos tipos de input.

Conceptos clave: bloques y campos

¿Qué es un bloque?

Un bloque es una sección del formulario que agrupa campos relacionados. Piensa en él como un "apartado" con un título descriptivo. Por ejemplo:

• "Datos de envío y facturación" — para agrupar nombre, dirección, teléfono, etc.
• "Comprobante de pago" — para el campo de archivo donde suben la captura del pago.
• "Información adicional" — para notas u observaciones del comprador.

¿Qué es un campo?

Un campo es un elemento de entrada dentro de un bloque. Es lo que el comprador realmente llena: un cuadro de texto, un selector de fecha, un botón para subir archivo, etc.

Bloques especiales: envío y pago

Existen dos tipos de bloques con una función especial que el sistema identifica con un ícono de información azul:

Tipo de bloque	Función	Obligatorio
Bloque de envío	Los campos de este bloque se usan en las etiquetas de envío. Aquí deben estar los datos de dirección, nombre del destinatario, etc.	Sí
Bloque de pago	Los campos de este bloque se usan como información de pago. Aquí va el comprobante de transferencia, referencia bancaria, etc.	Sí

Crear un nuevo bloque

1. Haz clic en el botón "Nuevo bloque" en la parte superior del formulario.
2. Se abrirá un modal donde debes escribir el nombre del bloque.
3. Haz clic en "Agregar" para confirmar.

Modal para crear un nuevo bloque en el formulario

Agregar campos a un bloque

Una vez que tienes un bloque, puedes agregar campos dentro de él:

1. Pasa el cursor sobre el bloque donde deseas agregar el campo.
2. Haz clic en el ícono "+" (agregar campo) que aparece junto al título del bloque, o abre el menú de tres puntos y selecciona "Nuevo campo".
3. Se abrirá un modal donde configuras el campo.

Modal para configurar un nuevo campo

Configuración del campo

Al crear o editar un campo debes completar los siguientes datos:

Parámetro	Descripción	Ejemplo
Título	El nombre visible del campo que verá el comprador	"Nombre completo", "Teléfono", "Cédula"
Tipo	El tipo de input que se mostrará (ver tabla de tipos más abajo)	Campo de texto, Lista de opciones, etc.
Leyenda	Texto de ayuda que aparece debajo del campo (opcional)	"Incluir código de área", "Formato: V-12345678"
Obligatorio	Si está marcado, el comprador no puede enviar el formulario sin llenar este campo	Sí / No

Tipos de campos disponibles

Cada tipo de campo está diseñado para capturar un tipo específico de información:

Tipo	Descripción	Cuándo usarlo
Campo de texto	Input de una sola línea para texto libre	Nombre, teléfono, cédula, email, dirección corta
Campo numérico	Input que solo acepta números	Número de referencia, monto de transferencia, cantidad
Caja de texto	Área de texto multilínea para textos largos	Dirección completa, observaciones, instrucciones de entrega
Campo de fecha	Selector de fecha con calendario interactivo	Fecha de transferencia, fecha deseada de entrega
Campo de archivo	Botón para subir un archivo (imagen, PDF, documento)	Comprobante de pago, captura de transferencia, factura
Lista de opciones	Dropdown con opciones predefinidas que defines tú	Método de pago, tipo de documento, banco emisor

Lista de opciones: cómo funciona

Cuando seleccionas el tipo "Lista de opciones", el campo se convierte en un dropdown. Después de crearlo, debes agregar las opciones que verá el comprador:

1. Pasa el cursor sobre el campo de tipo lista.
2. Haz clic en el ícono de lista (tres líneas horizontales) que aparece junto al campo.
3. Se abrirá un modal donde puedes agregar, editar o eliminar las opciones del dropdown.

Gestionar bloques

Cada bloque tiene un menú de opciones accesible de dos formas:

• Iconos al pasar el cursor: Aparecen junto al título del bloque cuando pasas el mouse.
• Menú de tres puntos: Un dropdown con todas las opciones disponibles.

Vista completa del formulario con bloques y campos

Acción	Ícono	Descripción
Nuevo campo	+	Agrega un nuevo campo dentro del bloque
Editar bloque	Lápiz	Cambia el nombre/título del bloque
Eliminar bloque	Papelera (rojo)	Elimina el bloque y todos sus campos (requiere confirmación)
Subir posición	Flecha arriba	Mueve el bloque una posición hacia arriba en el formulario
Bajar posición	Flecha abajo	Mueve el bloque una posición hacia abajo en el formulario

Gestionar campos

Al igual que los bloques, cada campo tiene opciones accesibles al pasar el cursor o mediante el menú de tres puntos:

Acción	Descripción
Editar campo	Modifica el título, tipo, leyenda u obligatoriedad del campo
Eliminar campo	Elimina el campo del bloque (requiere confirmación)
Subir campo	Mueve el campo una posición hacia arriba dentro del bloque
Bajar campo	Mueve el campo una posición hacia abajo dentro del bloque
Editar opciones	Solo para campos tipo "Lista": permite gestionar las opciones del dropdown

Ejemplo práctico: formulario recomendado

A continuación te mostramos un ejemplo de cómo estructurar un formulario de checkout efectivo:

Bloque 1: Datos de envío y facturación

Campo	Tipo	Obligatorio
Nombre completo	Campo de texto	Sí
Cédula / RIF	Campo de texto	Sí
Teléfono	Campo de texto	Sí
Nombre del destinatario	Campo de texto	Sí
Dirección	Caja de texto	Sí
Ciudad / Estado	Campo de texto	Sí
Código postal	Campo de texto	No

Bloque 2: Comprobante de pago

Campo	Tipo	Obligatorio
Método de pago	Lista de opciones	Sí
Número de referencia	Campo de texto	Sí
Fecha de la transferencia	Campo de fecha	Sí
Monto transferido	Campo numérico	Sí
Captura del comprobante	Campo de archivo	Sí

Beneficios de un formulario bien configurado

Puntos de interés