Stripe Checkout: acepta pagos en tus landing pages

El elemento Stripe Checkout añade un formulario de pago seguro directamente a tu landing page. Los visitantes introducen los datos de su tarjeta y pagan sin salir de la página, así que el comprador se mantiene dentro de tu embudo desde el primer clic hasta la compra. Los pagos los procesa Stripe. Los datos de la tarjeta van directamente a Stripe y nunca pasan por LanderLab.

​

Antes de empezar

Conecta tu cuenta de Stripe en Integrations. El checkout usa esa conexión para procesar los pagos y para cargar tus productos y cupones de Stripe.

​

Añade el elemento Stripe Checkout

1. Abre tu página en el editor.
2. En la barra lateral izquierda, abre Elements y busca la categoría Conversion.
3. Arrastra Stripe Checkout al lienzo.
4. Haz clic en el elemento para abrir sus ajustes en el panel derecho.

El lienzo muestra el checkout en modo de vista previa. Se actualiza en tiempo real a medida que cambias los ajustes, así que ves exactamente lo mismo que verán tus visitantes.

​

Producto

Elige de dónde salen los datos del producto con el ajuste Source. Manual te ofrece estos campos:

• Name: el nombre del producto que aparece en la parte superior del checkout
• Description: una línea breve bajo el nombre, por ejemplo Envío gratis
• Image: una miniatura opcional del producto

Con Stripe product, abre el desplegable Product y busca en tu catálogo de Stripe. Los productos se agrupan en One-time (pago único) y Recurring (recurrente). Si acabas de añadir un producto en Stripe y no aparece, haz clic en Refresh products. También puedes añadir una Image para mostrarla junto al nombre del producto.

​

Facturación

Para los productos manuales, elige One-time para un pago único o Recurring para una suscripción, y después define el Price y la moneda. En los productos de Stripe, estos ajustes están ocultos porque el precio y el tipo de facturación vienen de Stripe.

​

Adaptive Pricing

Activa Adaptive Pricing para mostrar el precio en la moneda local del visitante. Stripe se encarga de la conversión y el checkout muestra un selector de moneda para que el comprador elija entre tu moneda y la suya. El importe final puede variar ligeramente según el tipo de cambio.

​

Cantidad

Define la Quantity predeterminada del pedido. Activa Let customers change quantity para mostrar un selector de cantidad y después define el Min y el Max que puede elegir el comprador. El checkout muestra un subtotal y un total que se actualizan al cambiar la cantidad.

​

Descuento

Los cupones y los códigos promocionales vienen de tu cuenta de Stripe. Créalos primero en Stripe y después haz clic en Refresh coupons si no aparecen en la lista.

​

Envío

Activa Collect shipping address para pedir una dirección de entrega en el checkout. El formulario añade una sección Shipping information con los campos de nombre completo, país y dirección. La casilla Billing info is same as shipping evita que el comprador tenga que escribir su dirección dos veces.

• Countries: mantén All countries o selecciona solo los países a los que envías
• Shipping Options: haz clic en Add shipping option para crear una tarifa de envío

Cada opción de envío tiene:

• Name, por ejemplo Envío estándar o Exprés
• Price, con 0 para envío gratuito
• Delivery estimate, un rango mínimo y máximo de días de entrega

Añade varias opciones para que el comprador pueda elegir. La tarifa seleccionada se suma al total del pedido.

​

Checkout

• Button Text: texto personalizado para el botón de pago. Déjalo vacío para usar el predeterminado de Stripe, que muestra el importe, como Pay $88.20
• Language: el idioma del formulario de pago. Auto usa el idioma del navegador del visitante
• Theme: el estilo visual del formulario. Match Page lo integra con el diseño de tu página
• Billing Address: recoge la dirección de facturación completa del comprador
• Stripe Link: permite que el comprador guarde sus datos de pago con Stripe Link para comprar más rápido la próxima vez
• One purchase per visitor: impide que un mismo visitante pague dos veces, útil en ofertas de pago único

​

Pago completado

Elige qué ocurre después de un pago correcto con el ajuste Action. Con Stay on page, escribe tu propio Confirmation Message. Si lo dejas vacío, el comprador verá Payment received, thank you!

​

Diseño

Como en otros elementos, puedes ajustar la Position (alineación a la izquierda, al centro o a la derecha), las Dimensions (el ancho predeterminado es 360px) y el Spacing (margin y padding).

​

Antes de publicar

1. Haz clic en Preview y revisa el checkout tal y como lo vería un visitante.
2. Comprueba el precio, la moneda, el descuento y los totales de envío.
3. Asegúrate de que no aparezca ningún aviso bajo el checkout en el lienzo. Un aviso significa que falta un producto o un cupón obligatorio.
4. Publica la página.

​

Preguntas frecuentes