Criar um formulário front-end com JetFormBuilder e ACF é permitir que visitantes ou usuários cadastrados enviem conteúdo pelo próprio site, sem acessar o painel, gerando um post de um tipo definido com os dados gravados em campos do ACF. É o que viabiliza um diretório colaborativo, o envio de um anúncio ou o cadastro de um profissional pela frente do site. O JetFormBuilder monta o formulário e a ação de criar o post; o ACF guarda os campos. O segredo é mapear cada campo do formulário ao campo certo. Este guia faz parte do hub de Crocoblock da FULL e mostra o passo a passo real, do formulário ao post gerado.

O que um formulário front-end resolve e o papel de cada ferramenta

Um formulário front-end resolve a entrada de conteúdo sem acesso ao painel: em vez de o administrador cadastrar tudo, o próprio usuário envia o conteúdo por um formulário na frente do site, e o JetFormBuilder transforma esse envio em um post de um tipo definido, com os dados gravados em campos do ACF. O JetFormBuilder cuida do formulário e da ação; o ACF guarda a estrutura. A diferença para um formulário de contato comum é o destino: aqui o envio vira conteúdo, não só uma mensagem.

Na prática, você monta os campos do formulário, define a ação de inserir um post e mapeia cada campo para o campo correspondente do ACF. Assim, um diretório recebe cadastros direto do público. Nos atendimentos da FULL sobre Crocoblock, o erro mais comum é montar o formulário e a ação, mas esquecer de mapear os campos para o ACF, e o post nascer sem os dados que o usuário enviou.

Legenda: o envio do formulário vira um post com os dados gravados nos campos do ACF.

Quando vale um formulário de envio pelo front-end

Vale usar um formulário front-end quando você quer que usuários enviem conteúdo sem acesso ao painel, como um diretório colaborativo, um classificado ou o cadastro de um perfil, e não compensa quando só a equipe interna cria conteúdo, que o painel padrão resolve. O envio pelo front-end rende quando a entrada de dados é distribuída entre muitos usuários. Para um site cujo conteúdo vem só de dentro, o formulário front-end adiciona complexidade sem necessidade.

Use este teste antes de montar. Diga SIM ao formulário front-end se o seu site recebe conteúdo de visitantes ou membros, como anúncios ou cadastros. Diga NÃO se só a sua equipe pública, pelo painel. O encaixe ideal é a plataforma colaborativa, em que o público alimenta o conteúdo. Para a estrutura de campos que o formulário preenche, o guia de Custom Post Types com JetEngine e ACF PRO mostra a base.

Pré-requisitos antes de montar o formulário

Antes de montar o formulário front-end você precisa de três peças no lugar, o JetFormBuilder instalado, um Custom Post Type com os campos do ACF já criados, e a definição de quais campos do formulário viram quais campos do post, e a falta de qualquer uma deixa o envio sem onde gravar. Sem o post type e os campos prontos, a ação de inserir o post não tem estrutura para preencher.

Checklist de prontidão antes de começar:

• JetFormBuilder instalado e ativo no WordPress.
• Um Custom Post Type criado, com os campos do ACF atribuídos.
• O mapeamento planejado de cada campo do formulário ao do post.
• A definição do status do post enviado: rascunho ou publicado.
• A política de moderação, se o envio precisa de aprovação.
• Uma proteção anti-spam para o formulário público.
• Permissão de administrador para criar formulários e ações.

Pense no conjunto como uma caixa de sugestões que vira ficha de arquivo: o formulário é a caixa onde o usuário deposita, o JetFormBuilder é quem transcreve para uma ficha e o ACF é o formato da ficha no arquivo. Sem o mapa de qual campo vai para qual linha, a transcrição sai embaralhada ou vazia.

Como criar o formulário front-end em 5 passos

Criar o formulário front-end segue cinco passos, do formulário ao post moderado, e respeitar a ordem evita o erro mais comum: enviar sem mapear os campos para o ACF. Cada passo fecha uma etapa, do campo à publicação. Confirme antes que o post type e os campos do ACF existem, porque é neles que o envio será gravado.

Passo 1: Monte os campos do formulário

No JetFormBuilder, crie o formulário com os campos que o usuário vai preencher, alinhando cada um ao dado que ele representa, como título, descrição, categoria e imagem, porque são esses campos que vão alimentar o post. Use os tipos certos: texto para o nome, área de texto para a descrição, upload para a imagem. Mantenha o formulário só com o necessário. Um formulário enxuto e claro aumenta a chance de o usuário concluir o envio, então peça apenas o que o conteúdo realmente precisa para ser publicado.

Passo 2: Adicione a ação de inserir post

Configure a ação pós-envio do formulário para inserir um post, escolhendo o Custom Post Type de destino, porque é essa ação que transforma o envio em conteúdo, e não só em uma entrada de formulário. Defina o tipo do post que será criado a partir do envio. Sem essa ação, o formulário coleta os dados, mas nada vira post. Esse é o passo que diferencia um formulário front-end de um formulário de contato: a ação de inserção é o que cria conteúdo real no site a partir do que o usuário enviou.

Passo 3: Mapeie os campos para o ACF

Na configuração da ação, ligue cada campo do formulário ao campo correspondente do post, mapeando o título ao título, a descrição ao conteúdo e os campos extras aos campos do ACF, porque é esse mapeamento que faz o dado enviado chegar no lugar certo do post. Confira a grafia de cada campo do ACF. Um mapeamento incompleto cria posts sem os dados que o usuário preencheu. Se os campos do ACF não recebem o valor enviado, veja como corrigir os Custom Fields que não aparecem no frontend no ACF PRO.

Passo 4: Defina o status e a moderação

Decida se o post enviado nasce como rascunho, aguardando aprovação, ou já publicado, porque conteúdo enviado pelo público costuma precisar de moderação antes de ir ao ar. Defina o status na ação de inserir post. Para um diretório aberto, o rascunho com revisão evita conteúdo impróprio publicado direto. Pense no equilíbrio entre agilidade e controle: a moderação protege a qualidade do site, mas adiciona um passo, então escolha conforme o nível de confiança no público que envia o conteúdo.

Passo 5: Teste o envio de ponta a ponta

Preencha e envie o formulário como um usuário e confirme que o post é criado com o status certo e todos os campos do ACF preenchidos, porque só o teste real prova que o mapeamento e a ação funcionam. Cheque o post gerado no painel. Teste também o upload de imagem, se houver. Se o formulário não envia ou trava no processamento, veja como corrigir o JetFormBuilder que não envia, e se o upload de arquivo falha, veja como corrigir o upload que falha no JetFormBuilder.

Legenda: cada passo fecha uma etapa, do formulário ao post gerado com os dados mapeados.

Erros comuns ao criar um formulário front-end

Os três erros mais comuns ao criar um formulário front-end são não mapear os campos para o ACF, esquecer a moderação e ignorar o spam. O primeiro é o mais frustrante: o formulário envia, a ação cria o post, mas, sem o mapeamento, o conteúdo dos campos do ACF se perde, e o post nasce vazio nos dados que o usuário preencheu com cuidado.

O segundo erro é publicar o envio direto, sem moderação, em um formulário aberto ao público, o que deixa conteúdo impróprio ir ao ar sem revisão. A correção é definir o status como rascunho para revisão. O terceiro caso é não proteger o formulário público, que vira alvo de spam e enche o site de posts falsos. Quando o CPT criado pelo envio não aparece na frente do site, vale ver como corrigir o CPT do JetEngine que não aparece no frontend.

Como manter o envio de conteúdo confiável

Manter o envio pelo front-end confiável exige moderar o conteúdo e proteger o formulário de spam, porque um formulário aberto recebe tanto envios legítimos quanto tentativas automáticas, e conteúdo sem revisão pode prejudicar a qualidade e a reputação do site. A confiança em um formulário público vem do controle entre receber e publicar.

Mantenha a moderação ativa para envios de fontes não confiáveis, revisando antes de publicar, e proteja o formulário com um desafio anti-spam. Defina campos obrigatórios para garantir o mínimo de qualidade no envio. Acompanhe os rascunhos recebidos com regularidade, para não acumular fila. Para os campos que estruturam o conteúdo enviado, o guia de Custom Post Types com JetEngine e ACF PRO mostra como montar a base.

Como a FULL faz isso em escala

A FULL padroniza formulários front-end porque acompanha mais de 150 mil sites WordPress, e plataformas colaborativas que recebem conteúdo do público aparecem entre diretórios e classificados, onde montar o fluxo de envio em cada site vira gargalo. Em vez de licença avulsa por instalação, o Crocoblock, com o JetFormBuilder, entra no bundle e o padrão de envio front-end fica replicável de um projeto para outro.

No plano PRO da FULL, por R$849, o Crocoblock já vem no pacote para até dez sites, o que dá R$85 por site em vez de pagar cada licença separada. Para quem monta vários sites colaborativos, a gente vê isso trocar um custo recorrente espalhado por um padrão único: o mesmo formulário front-end, com a ação de inserir post e o mapeamento de campos, é reaproveitado de um projeto para outro, sem remontar do zero a cada site. É a economia que só aparece quando o stack é o mesmo em toda a base.

Checklist final do formulário front-end

O checklist final do formulário front-end confirma, em uma passada, que o envio vira conteúdo completo antes de você abrir ao público. Rode esta lista depois do passo 5 e a cada campo novo no post type, porque o mapeamento precisa acompanhar a estrutura.

Antes de declarar pronto, confirme:

• Os campos do formulário coletam o conteúdo necessário.
• A ação de inserir post aponta para o Custom Post Type certo.
• Cada campo do formulário está mapeado para o campo do post.
• O status do envio está definido como rascunho ou publicado.
• A moderação está configurada conforme a confiança no público.
• Um envio de teste gerou o post com todos os dados.
• O formulário está protegido contra spam.

Se qualquer item falhar, volte ao passo correspondente antes de abrir o envio ao público.

Perguntas frequentes sobre formulário front-end com JetFormBuilder e ACF

Próximos passos para um site que recebe conteúdo do público

Criar um formulário front-end com JetFormBuilder e ACF é, no fundo, transformar o envio do usuário em conteúdo estruturado: monte os campos, adicione a ação de inserir post, mapeie para o ACF, defina o status e teste o envio. Não mapear os campos para o ACF é o erro que mais deixa o post vazio, então confira cada ligação. Para padronizar o Crocoblock em vários sites sem licença avulsa, conheça os planos da FULL, e para continuar aprendendo, o FULL Academy reúne os tutoriais de WordPress em um só lugar.