Como Usar o Bloco Formulário de Pagamento

Tempo de leitura: 4 minutos | Dificuldade: Iniciante

Visão Geral

O bloco WP Simple Pay – Formulário de Pagamento é a maneira recomendada de inserir um formulário de pagamento em uma postagem ou página do Gutenberg. Ele fornece uma prévia ao vivo do formulário dentro do editor, expõe opções de exibição na barra lateral do bloco e renderiza o mesmo formulário na página que um cliente veria — sem que você precise copiar um shortcode.

O bloco é funcionalmente equivalente ao shortcode , mas é mais fácil de descobrir e fornece prévias do editor que refletem as configurações atuais de Estilo do Formulário.

Pré-requisitos

• WP Simple Pay (qualquer plano — o bloco vem com o plugin gratuito)
• Um site WordPress executando o editor de blocos (Gutenberg)
• Pelo menos um formulário de pagamento publicado

Etapa 1: Inserir o Bloco

1. Edite a postagem ou página onde você deseja que o formulário apareça.
2. Clique no inseridor de blocos +.
3. Procure por WP Simple Pay ou Formulário de Pagamento.
4. Clique no bloco WP Simple Pay – Formulário de Pagamento.

Um espaço reservado aparece, solicitando que você selecione um formulário.

Etapa 2: Escolha um Formulário

Use o menu suspenso no espaço reservado do bloco para escolher qual formulário de pagamento publicado renderizar. Uma vez selecionado, o bloco substitui o espaço reservado por uma prévia ao vivo do formulário, incluindo título, descrição, campos e o botão de envio — estilizado com as configurações atuais de Estilo do Formulário.

Se você alterar o Estilo do Formulário após inserir o bloco, a prévia será atualizada na próxima vez que você recarregar o editor.

Etapa 3: Configure as Opções de Exibição

Com o bloco selecionado, a barra lateral de configurações do bloco à direita expõe duas opções:

• Mostrar Título — Quando ativado (padrão), exibe o título do formulário acima dos campos. Desative para ocultar o título — útil quando a página circundante já possui um cabeçalho.
• Mostrar Descrição — Quando ativado (padrão), exibe o texto da descrição do formulário acima dos campos. Desative para layouts compactos.

Se você desativar ambos, o contêiner do título/descrição é suprimido inteiramente, para que não haja espaço em branco sobrando.

O bloco também suporta Alinhamento Central através da barra de ferramentas padrão do bloco. Quando centralizado, o formulário, o cabeçalho incorporado e o botão de envio são centralizados horizontalmente dentro da largura do conteúdo da página e a área do cabeçalho é limitada a uma largura máxima de 400px.

Etapa 4: Publique e Visualize

Salve ou publique a página. Visualize-a no frontend para ver o formulário em seu estado renderizado. O bloco usa o mesmo pipeline de renderização do shortcode, portanto, o comportamento no frontend é idêntico.

Bloco vs Shortcode

	Bloco	Shortcode
Pré-visualização do editor	Ao vivo, estilizado	Nenhum — apenas placeholder
Alternâncias de exibição	Caixas de seleção da interface do usuário	Editar manualmente os atributos do shortcode
Alinhamento	Barra de ferramentas do bloco	Envolver em HTML/CSS
Funciona no editor clássico	Não	Sim
Funciona em widgets	Sim (widgets de bloco)	Sim
Funciona em page builders	Depende do construtor	Sim (universal)

Quando usar o bloco: Posts e páginas modernos do Gutenberg, modelos FSE, widgets baseados em blocos.

Quando usar o shortcode: Editor clássico, page builders sem suporte nativo a blocos, modelos de tema personalizados onde você chama do_shortcode() diretamente.

Perguntas Frequentes

A pré-visualização do formulário é exibida, mas os clientes não conseguem pagar — por quê?

O bloco renderiza o mesmo formulário para a pré-visualização do editor que para os visitantes. Se a pré-visualização mostra o formulário, mas as submissões falham, o problema está na própria configuração do formulário (método de pagamento ausente, chaves Stripe inválidas, campo obrigatório ausente) e não no bloco. Verifique WP Simple Pay > Formulários de Pagamento e as abas Geral/Pagamento do formulário.

Posso usar vários blocos de Formulário de Pagamento na mesma página?

Sim — cada bloco pode renderizar um formulário diferente. Os assets de frontend do plugin são inteligentes o suficiente para lidar com vários formulários na mesma página sem conflitos.

Por que a pré-visualização do editor não corresponde ao que vejo no frontend?

A pré-visualização do editor reflete o estado salvo do formulário no momento em que o editor foi carregado. Se você fez alterações no formulário em outra aba, salve/atualize o editor para vê-las. O frontend sempre renderiza a versão salva mais recente.

O bloco funciona em modelos de Edição Completa do Site (FSE)?

Sim. O bloco pode ser inserido em qualquer contexto compatível com blocos, incluindo modelos FSE, partes de modelos e blocos/padrões reutilizáveis.

Posso estilizar o formulário incorporado de forma independente por página?

O Estilo do Formulário é por formulário, não por bloco. Para usar estilos diferentes em páginas diferentes, crie vários formulários e insira o bloco apropriado em cada página.

Qual a diferença entre este e o bloco Botão WP Simple Pay?

O bloco Formulário de Pagamento incorpora o formulário inteiro inline. O bloco Botão exibe apenas um botão que abre o formulário em uma sobreposição (modal) quando clicado — útil para páginas de destino onde você deseja uma chamada para ação clara em vez de um formulário visível. Veja Como Usar o Bloco Botão de Pagamento.

Próximos Passos?

• Como Estilizar Seus Formulários de Pagamento com Estilo de Formulário – Personalize a aparência do formulário incorporado
• Como Usar o Bloco Gerenciar Assinaturas – Permita que os assinantes gerenciem seus planos
• Como Configurar as Configurações Gerais de um Formulário de Pagamento – Configure o próprio formulário