Stripe Payment Links: configuração, botões no site e páginas de agradecimento
Guia do Stripe Payment Link
Stripe Payment Link: configure, incorpore um botão e redirecione após o pagamento | We.Inc
Crie um Stripe Payment Link, coloque no seu site como um botão estilizado ou um Buy Button, envie os compradores para a sua própria página de agradecimento e acompanhe qual campanha gerou a venda. Com código de botão para copiar.
Um Stripe Payment Link é uma página de checkout hospedada que você cria no Dashboard do Stripe sem código. Crie um produto com um preço, gere o link e coloque-o atrás de um botão no seu site. Você pode redirecionar os compradores para a sua própria página de agradecimento depois do pagamento e adicionar parâmetros ao link para preencher o email ou marcar a venda.
Payment Link, Buy Button ou Checkout?
Opção
Código necessário
Ideal para
Payment Link
Nenhum; compartilhe ou crie um link para uma URL
Vender poucos produtos, cobranças por link, bios de redes sociais
Buy Button
Colar um script e uma tag
Um botão com o visual do Stripe incorporado na sua página
Checkout (API)
Código no servidor cria cada sessão
Carrinhos, preços por cliente, apps com login
Este guia cobre a configuração no Dashboard, três formas de colocar o link em um site, o redirecionamento para a sua própria página de sucesso, os parâmetros de link para preencher dados e rastrear vendas, e as configurações que as pessoas esquecem: impostos, quantidades e códigos promocionais.
No Dashboard do Stripe, adicione um produto com nome, imagem e um preço único ou recorrente.
Crie um link de pagamento para esse preço e escolha opções como quantidade, códigos promocionais, cobrança de impostos e quais dados coletar.
Nas configurações de pós-pagamento, mantenha a página de confirmação do Stripe ou redirecione para uma página do seu próprio site.
Copie o link e coloque-o atrás de um botão no seu site, ou crie um Buy Button e cole o código de incorporação.
Teste o fluxo completo no modo de teste com o cartão de teste do Stripe, depois mude para o modo live e repita com uma compra real que você reembolsa.
Crie um link por produto e preço. Quando o preço mudar, crie um link novo e troque no seu site em vez de reaproveitar um link para o qual posts e emails antigos ainda apontam.
Ative os códigos promocionais nas configurações do link se pretende oferecer descontos. Assim, os códigos criados depois funcionam sem mexer no site.
Envie os compradores para a sua própria página de agradecimento para mostrar os próximos passos, registrar a conversão e oferecer algo relacionado.
Escreva um rótulo de botão claro com o preço, por exemplo Comprar o template, $29. Menos surpresas no checkout significam menos pagamentos abandonados.
Perguntas frequentes
Os Payment Links têm algum custo extra?
O Stripe não cobra pelo link em si. Você paga a taxa normal de processamento do Stripe em cada pagamento bem-sucedido, que depende do seu país e da forma de pagamento. Use a calculadora de taxas de processamento de pagamento para ver quanto sobra de cada venda.
Um Payment Link pode vender uma assinatura?
Sim. Dê ao produto um preço recorrente, como mensal ou anual, e o link inicia uma assinatura. Os clientes podem gerenciá-la pelo portal do cliente do Stripe, se você ativá-lo.
Como redireciono para a minha própria página depois do pagamento?
Nas configurações de pós-pagamento do link, escolha não mostrar a página de confirmação do Stripe e informe a URL da sua página. Você pode incluir {CHECKOUT_SESSION_ID} na URL, e o Stripe o substitui pelo ID da sessão para que a sua página ou o seu servidor consiga consultar o pedido.
O redirecionamento basta para entregar um produto digital?
Sozinho, não. Qualquer pessoa com a URL consegue abrir uma página de agradecimento. Para downloads ou acesso a uma conta, faça a entrega por algo que o Stripe confirme, como um webhook no seu servidor, uma automação que reaja ao pagamento ou uma plataforma de entrega conectada ao Stripe.
Consigo ver de qual campanha veio uma venda?
Sim. O Stripe documenta utm_source, utm_medium, utm_campaign, utm_term e utm_content como parâmetros de link, e client_reference_id para a sua própria referência. Adicione-os ao link por trás de cada anúncio ou post.
Configurando o link
Comece no modo de teste para que nada real seja cobrado. Crie primeiro o produto, porque o link é montado a partir de um produto e de um preço. Adicione um nome claro e uma imagem quadrada; os dois aparecem na página de checkout.
Ao criar o link, decida o que coletar: endereço de cobrança, endereço de entrega, telefone ou campos personalizados, como o nome da empresa. Cada campo extra custa alguns pagamentos concluídos, então peça só o que precisa para atender o pedido.
Se você vende para lugares que cobram imposto sobre vendas ou IVA, ative a cobrança automática de impostos, que usa o Stripe Tax e exige que os seus registros fiscais estejam configurados. Caso contrário, inclua o imposto no preço e avise isso na página.
Colocando no seu site
O caminho mais simples é um link comum estilizado como botão, que carrega na hora e combina com o seu design. Os exemplos abaixo trazem três estilos para copiar. O Buy Button é o segundo caminho: o Stripe desenha o botão para você dentro da sua página e cuida do clique.
Abra o link na mesma aba. Abrir o checkout em uma nova aba confunde quem está no celular e quebra o retorno para a sua página de agradecimento.
Código de botão para o seu link de pagamento
Troque o href pelo seu próprio link. Cada botão é um link simples, então funciona em qualquer criador de sites que aceite HTML.
Botão sólido com preço
Um botão chamativo que ocupa toda a largura no celular e se ajusta em telas mais largas.
Card de preço com botão
Um card pequeno para um único produto, com o que está incluído e uma frase tranquilizadora abaixo do botão.
Botão com contorno para uma opção secundária
Use um estilo mais discreto para um segundo preço, como um plano anual ao lado de um mensal.
Incorporação do Stripe Buy Button
Crie o Buy Button na página do link de pagamento no Dashboard e cole o código que ele fornece. O formato é este.
Código de incorporação do Buy Button
O script carrega uma vez por página; cada tag stripe-buy-button desenha um botão. Os IDs vêm do seu Dashboard.
Buy Button em React
Carregue o script uma vez e depois renderize o elemento personalizado. Em TypeScript, talvez você precise declarar o elemento em um arquivo .d.ts.
Parâmetros de link para preencher dados e rastrear
Adicione-os ao final do link como query string. Os valores precisam estar codificados para URL.
Parâmetros de URL do Payment Link documentados pelo Stripe
Parâmetro
Exemplo
O que faz
?prefilled_email=ana%40example.com
Preenche o campo de email
?prefilled_promo_code=LAUNCH20
Aplica um código promocional (os códigos promocionais precisam estar ativados)
?client_reference_id=order_1042
Guarda a sua própria referência na sessão de checkout
Copia as tags UTM da URL da página para todos os links de pagamento da página, para que a venda seja atribuída ao anúncio ou post que trouxe o visitante.
Uma página de agradecimento que lê a sessão
Defina o redirecionamento pós-pagamento para uma URL como https://yoursite.com/thanks?session_id={CHECKOUT_SESSION_ID}. A página pode mostrar uma mensagem amigável na hora e, se você tiver um servidor, confirmar o pagamento.
Corpo da página de agradecimento
HTML simples que funciona em qualquer lugar. Mantenha a entrega real (link de download, acesso à conta) atrás de uma verificação no servidor ou de um webhook.
Confirme a sessão no seu servidor (Node)
Usa a biblioteca oficial do Stripe para Node. Nunca confie só na URL; pergunte ao Stripe se a sessão foi paga.