Como Escolher um Tipo de Exibição de Método de Pagamento
Neste Documento
Visão Geral
O WP Simple Pay permite que você escolha como os métodos de pagamento são exibidos em seus formulários de pagamento no site. Você pode mostrá-los como Abas horizontais (o padrão) ou como um Acordeão empilhado. Esta configuração controla o layout do Elemento de Pagamento Stripe no frontend.
Pré-requisitos
- WP Simple Pay Pro
- Um formulário de pagamento usando o tipo de formulário no local (Embutido ou Sobreposição)
- Pelo menos um método de pagamento habilitado para o formulário
Configurando o Tipo de Exibição
- Navegue até WP Simple Pay > Formulários de Pagamento e edite seu formulário.
- Clique na aba Campos do Formulário.
- Expanda o campo Método de Pagamento (rotulado como “Cartão” em formulários mais antigos).
- Em Tipo de Exibição, selecione Abas ou Acordeão.
- Clique em Publicar ou Atualizar para salvar.
Layout de Abas
Abas é o tipo de exibição padrão. Os métodos de pagamento aparecem como abas horizontais na parte superior da área de pagamento. Os clientes clicam em uma aba para alternar entre os métodos.
Ideal para:
- Formulários com um pequeno número de métodos de pagamento (2-5)
- Layouts limpos e compactos onde há espaço horizontal disponível
Layout de Acordeão
O layout de Acordeão exibe os métodos de pagamento como itens empilhados verticalmente e recolhíveis. Os clientes clicam em um item para expandi-lo e revelar seus campos.
Ideal para:
- Formulários com muitos métodos de pagamento (5+)
- Layouts amigáveis para dispositivos móveis onde a exibição vertical funciona melhor
- Situações em que você deseja que os nomes e ícones dos métodos de pagamento estejam claramente visíveis
Configurações do Acordeão
Quando você seleciona Acordeão, uma seção adicional Configurações do Acordeão aparece:
- Itens Visíveis — O número de métodos de pagamento a serem exibidos antes que um botão “Mais” apareça. Padrão: 5. Defina como 0 para mostrar todos os métodos sem um botão “Mais”.
Isso é útil quando seu formulário tem muitos métodos de pagamento e você deseja manter a visualização inicial compacta, mas ainda assim oferecer todas as opções.
Começar Recolhido
Por padrão, o primeiro item do acordeão é expandido quando o formulário é carregado. Você pode alterar esse comportamento usando o filtro simpay_payment_form_accordion_default_collapsed para que todos os itens comecem recolhidos:
add_filter( 'simpay_payment_form_accordion_default_collapsed', '__return_true' );
Isso também pode ser limitado a um formulário específico verificando o objeto do formulário passado como segundo argumento.
Escolhendo o Layout Certo
| Consideração | Abas | Acordeão |
|---|---|---|
| Número de métodos | 2-5 | 5+ |
| Espaço horizontal | Abundante | Limitado |
| Experiência no celular | Bom | Melhor |
| Visibilidade do método | Ícones visíveis rapidamente | Nomes + ícones visíveis |
| Espaço vertical | Compacto | Mais alto |
Perguntas Frequentes
O tipo de exibição afeta quais métodos de pagamento estão disponíveis?
Não. O tipo de exibição apenas altera a forma como os métodos são organizados visualmente. Todos os métodos de pagamento habilitados permanecem disponíveis, independentemente da escolha do layout.
Isso funciona com formulários do Stripe Checkout (fora do site)?
Não. A configuração do tipo de exibição se aplica apenas a formulários no site que usam o Elemento de Pagamento do Stripe. Formulários fora do site redirecionam para a página de checkout hospedada do Stripe, que tem seu próprio layout.
Posso usar tipos de exibição diferentes para formulários diferentes?
Sim. O tipo de exibição é configurado por formulário no campo Método de Pagamento, então cada formulário pode ter seu próprio layout.
O que acontece em dispositivos móveis?
Ambos os layouts são responsivos. O Elemento de Pagamento da Stripe se ajusta automaticamente para telas menores. O layout Acordeão tende a funcionar particularmente bem em dispositivos móveis, pois empilha verticalmente.
Próximos Passos?
- Estilizando formulários de pagamento com Estilo de Formulário – Personalize cores, tipografia e layout
- Referência de configurações de Estilo de Formulário – Referência completa de todas as configurações de estilo
Ainda tem dúvidas? Estamos aqui para ajudar!
Última Modificação: