Pular para o conteúdo principal
Página de checkout
Dodo Payments checkout é um checkout otimizado para conversão, compatível globalmente, projetado para produtos digitais e empresas SaaS. Ele oferece suporte a múltiplas moedas, idiomas, impostos, descontos, complementos e fluxos de conformidade voltados para empresas.

Moeda Adaptativa

A Moeda Adaptativa permite que os clientes paguem em sua moeda local preferida, melhorando a confiança e as taxas de conversão.

Como Funciona

  1. Ativar: Ative a Moeda Adaptativa nas Configurações do Seu Negócio
  2. Selecionar: Os clientes podem trocar de moeda diretamente no checkout
  3. Converter: Os preços são convertidos dinamicamente usando taxas de câmbio em tempo real
  4. Exibir: O valor final a ser pago é mostrado de forma transparente antes do pagamento
Seletor de moeda no checkout

Adaptive Currency

Saiba mais sobre moedas suportadas, taxas de conversão e tratamento de reembolsos.

Checkout em Múltiplas Línguas

Dodo Payments suporta múltiplas línguas na página de checkout, permitindo que os clientes concluam pagamentos em um idioma com o qual se sintam confortáveis.
Seletor de idioma no checkout

Principais Destaques

  • Seletor de idioma disponível diretamente no checkout
  • Texto da interface, rótulos e mensagens do sistema são localizados
  • Melhora a acessibilidade e a conversão internacional

Idiomas Suportados

A página de checkout oferece suporte a 21 idiomas:
LanguageCode
Árabear
Catalãoca
Chinêszh
Holandêsnl
Inglêsen
Francêsfr
Alemãode
Hebraicohe
Indonésioid
Italianoit
Japonêsja
Coreanoko
Malaioms
Polonêspl
Portuguêspt
Romenoro
Russoru
Espanholes
Suecosv
Tailandêsth
Turcotr
Você pode forçar um idioma específico no checkout definindo o parâmetro force_language ao criar uma sessão de checkout. Veja a Checkout Sessions API para obter mais detalhes.

Cálculo automático de impostos

Os impostos são calculados automaticamente com base na localização de cobrança do cliente, garantindo conformidade com os requisitos de GST, VAT e imposto sobre vendas sem configuração manual.

Como funciona o cálculo de impostos

1

Location Detection

Regras de impostos são aplicadas com base no país do cliente (e na região, quando aplicável).
2

Dynamic Updates

O valor do imposto é atualizado automaticamente quando:
  • O país é alterado
  • O endereço é atualizado
3

Transparent Display

O detalhamento final dos impostos é mostrado claramente antes do pagamento.
O cálculo de impostos é totalmente automatizado. Nenhuma configuração manual é necessária para bens digitais padrão e produtos SaaS.

Suporte ao ID Fiscal da Empresa

Para empresas registradas, o checkout permite que os clientes insiram seu ID Fiscal (por exemplo, número VAT/GST).

O que acontece quando um ID Fiscal é inserido

  • A elegibilidade fiscal é validada em tempo real
  • Exceções fiscais aplicáveis ou regras de cobrança reversa são aplicadas
  • O valor do imposto é atualizado instantaneamente no checkout
Entrada do ID Fiscal Empresarial no checkout
Isso é especialmente útil para SaaS B2B e serviços digitais onde clientes empresariais podem ser elegíveis para isenções fiscais.

Códigos de desconto

Os clientes podem aplicar códigos de desconto ou promocionais criados no painel diretamente na página de checkout.

Experiência no checkout

  1. O cliente insere o código de desconto
  2. O desconto é validado instantaneamente
  3. O preço atualizado e a economia são exibidos claramente
Inserção do código de desconto no checkout

Integração com a API

Pré-aplique um código de desconto ou habilite o campo de entrada de desconto:
const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  discount_code: 'WELCOME20', // Pre-apply a code
  feature_flags: {
    allow_discount_code: true // Show discount input field
  },
  return_url: 'https://yoursite.com/return'
});

Discount Codes

Saiba como criar e gerenciar códigos de desconto.

Validate Discount by Code

Pesquise e valide descontos usando os nomes dos códigos.

Coleta inteligente de endereços

O checkout oferece suporte à entrada flexível de endereços para conclusão mais rápida.

Opções disponíveis

OpçãoDescrição
Preenchimento automático de endereço do GoogleSeleção rápida com autocomplete
Entrada manualControle total para endereços completos
Seleção de paísDefine a lógica de impostos e conformidade
A coleta de endereços equilibra velocidade, precisão e cobertura global para maximizar a conversão enquanto garante conformidade.

Campos personalizados

Colete informações adicionais dos clientes durante o checkout definindo campos de formulário personalizados. Isso é útil para reunir dados como nome da empresa, tamanho da equipe, origem da indicação ou qualquer outra informação específica do negócio.

Tipos de campo disponíveis

TipoDescrição
textCampo de texto de linha única
numberEntrada numérica
emailEndereço de e-mail com validação
urlURL com validação
dateSeletor de data
dropdownSelecione dentre opções predefinidas
booleanAlternância Sim/Não

Exemplo

const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  custom_fields: [
    {
      key: 'company_name',
      label: 'Company Name',
      field_type: 'text',
      required: true
    },
    {
      key: 'team_size',
      label: 'Team Size',
      field_type: 'dropdown',
      required: true,
      options: ['1-10', '11-50', '51-200', '200+']
    }
  ],
  return_url: 'https://yoursite.com/return'
});
As respostas dos clientes são incluídas automaticamente nos payloads de webhook (payment.succeeded, subscription.active) e nas respostas da API através do array custom_field_responses. Você pode definir até 5 campos personalizados por sessão de checkout.

Custom Fields Guide

Saiba mais sobre configuração de campos personalizados e acesso às respostas.

Políticas de Privacidade e Aceitação dos Termos

Para garantir transparência legal e de conformidade:
  • Os links para a Privacy Policy e os Buyer Terms são exibidos claramente no checkout
  • Os clientes reconhecem explicitamente isso antes de concluir o pagamento
Isso ajuda a atender aos requisitos globais de proteção do consumidor e privacidade de dados, incluindo conformidade com o GDPR.

Checkout de Coleções

As Coleções de Produtos permitem uma experiência de checkout unificada onde os clientes podem visualizar e selecionar múltiplos produtos relacionados (por exemplo, planos Starter, Pro, Enterprise) em um único checkout.

Como funciona

  1. Todos os produtos exibidos: Os clientes veem todos os produtos ativos da coleção
  2. Primeiro produto pré-selecionado: O primeiro produto da coleção é automaticamente selecionado
  3. Compare opções: Os clientes podem comparar preços e recursos antes de escolher
  4. Seleção única: Após selecionar um produto, o checkout prossegue com o fluxo de pagamento padrão

Criando um checkout de coleção

const session = await client.checkoutSessions.create({
  product_collection_id: 'pdc_abc123',
  product_cart: [], // Required: pass an empty array for collection checkout
  return_url: 'https://yoursite.com/return'
});
Ao usar product_collection_id, passe um array product_cart vazio. Códigos de desconto não podem ser pré-aplicados na criação da sessão.

Product Collections

Saiba como criar e gerenciar coleções de produtos para experiências de checkout unificadas.

Configuração da sessão de checkout

Controle o comportamento do checkout usando a API de Sessões de Checkout:
const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  customer: {
    email: 'customer@example.com',
    name: 'Jane Doe'
  },
  billing_currency: 'EUR', // Set specific currency
  discount_code: 'PROMO10',
  feature_flags: {
    allow_discount_code: true
  },
  return_url: 'https://yoursite.com/return',
  metadata: {
    order_ref: 'ORD-12345'
  }
});
Após o pagamento, os clientes são redirecionados para o seu return_url com parâmetros de consulta anexados automaticamente — incluindo payment_id ou subscription_id, status, email e license_key (se aplicável). Veja o Checkout Sessions guide para a lista completa.

Personalização do tema do checkout

Personalize a aparência da página de checkout para combinar com sua marca usando o parâmetro customization.theme_config ao criar uma sessão de checkout via API. Configure cores, fontes, raio da borda e texto do botão para os modos claro e escuro.
Página de checkout com tema personalizado

Design & Theme Customization

Configure temas visualmente a partir do painel usando temas pré-construídos, tipografia, cores e visualização ao vivo.
Esta seção aborda a configuração de tema da API do lado do servidor usando customization.theme_config. Se você estiver usando o SDK de Checkout (checkout em sobreposição ou inline), consulte as seções de customização de tema em Overlay Checkout ou Inline Checkout, que usam propriedades em camelCase (por exemplo, bgPrimary em vez de bg_primary).

Opções de Configuração do Tema

PropriedadeDescrição
lightConfiguração de cores para modo claro
darkConfiguração de cores para modo escuro
font_primary_urlURL da fonte primária
font_secondary_urlURL da fonte secundária
font_sizeTamanho da fonte: xs, sm, md, lg, xl, 2xl
font_weightPeso da fonte: normal, medium, bold, extraBold
radiusRaio da borda para elementos de UI (por exemplo, 4px, 0.5rem, 8px)
pay_button_textTexto personalizado para o botão de pagamento (por exemplo, “Complete Purchase”, “Subscribe Now”)

Configuração de Cores (Modo Claro/Escuro)

Cada modo (light e dark) oferece suporte às seguintes propriedades de cores:
PropriedadeDescrição
bg_primaryCor primária de fundo
bg_secondaryCor secundária de fundo
text_primaryCor primária do texto
text_secondaryCor secundária do texto
text_placeholderCor do texto de espaço reservado
text_errorCor do texto de erro
text_successCor do texto de sucesso
border_primaryCor primária da borda
border_secondaryCor secundária da borda
button_primaryCor de fundo do botão primário
button_primary_hoverCor de hover do botão primário
button_secondaryCor de fundo do botão secundário
button_secondary_hoverCor de hover do botão secundário
button_text_primaryCor do texto do botão primário
button_text_secondaryCor do texto do botão secundário
input_focus_borderCor da borda de foco de campo de entrada
Todos os campos de cor aceitam formatos padrão de cor CSS:
  • Hex: #fff, #ffffff, #ffffffff
  • RGB/RGBA: rgb(255, 255, 255), rgba(255, 255, 255, 0.5)
  • HSL/HSLA: hsl(120, 100%, 50%), hsla(120, 100%, 50%, 0.5)
  • Cores nomeadas: red, blue, transparent

Exemplo

const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  customization: {
    theme_config: {
      // Custom fonts
      font_primary_url: 'https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap',
      font_size: 'md',
      font_weight: 'medium',
      radius: '8px',
      pay_button_text: 'Complete Purchase',
      
      // Light mode colors
      light: {
        bg_primary: '#ffffff',
        bg_secondary: '#f5f5f5',
        text_primary: '#1a1a1a',
        text_secondary: '#666666',
        button_primary: '#0066ff',
        button_primary_hover: '#0052cc',
        button_text_primary: '#ffffff',
        border_primary: '#e0e0e0'
      },
      
      // Dark mode colors
      dark: {
        bg_primary: '#1a1a1a',
        bg_secondary: '#2d2d2d',
        text_primary: '#ffffff',
        text_secondary: '#a0a0a0',
        button_primary: '#3385ff',
        button_primary_hover: '#4d99ff',
        button_text_primary: '#ffffff',
        border_primary: '#404040'
      }
    }
  },
  return_url: 'https://yoursite.com/return'
});
Não é necessário especificar todas as propriedades de cor. Qualquer propriedade não especificada usará os valores padrão do tema.