Criação de formulÔrios (Contact 7)
OlĆ”! Este tutorial ensina a criar formulĆ”rios dentro do Wordpress. Para este tutorial estamos usando o Contact 7, um plugin que, alĆ©m de oferecer uma variedade de campos e customização fĆ”cil do email a ser enviado, Ć© compatĆvel com um outro plugin de extração de relatório de formulĆ”rios enviados, o āCRM Entriesā
Atenção: recomendamos que o formulÔrio seja antes criado em uma pÔgina de testes. Após estar pronto, só precisa copiar o elemento para a pÔgina desejada.
Ā
Criando o formulƔrio
Antes de criar o formulÔrio, tenha um rascunho dos campos que serão usados, e a ordem dos mesmos.
Para criar o formulÔrio, procure por esta opção na barra lateral esquerda de seu Wordpress:
Ā
Para editar um formulĆ”rio, apenas pouse o mouse em cima do formulĆ”rio existente, e clique em āEditarā. Vamos criar um novo. Procure pela opção āAdicionar novoā, geralmente no topo da pĆ”gina.
Ele jƔ virƔ preenchido com algumas opƧƵes bastante comuns de formulƔrios de contato. Vamos usar como exemplo.
Ā
OBS: este campo de texto para inserção dos campos de formulĆ”rio aceita HTML. EntĆ£o se vocĆŖ estiver familiarizado com HTML, conseguirĆ” fazer algumas customizaƧƵes a mais, como colocar campos lado a lado, com tamanhos personalizados, cores de destaqueā¦
Você verÔ essa seção, que são as opções de campos que o Contact 7 oferece. São muitas opções, e ao selecionar cada uma, ela darÔ uma gama de personalizações para suas necessidades. Vamos selecionar como exemplo um campo de texto. Repare na posição do meu cursor, circulada abaixo.
Selecionei a opção de campo de texto e fiz as seguintes alterações:
Ā
E ao clicar em āInserir tagā, o Contact 7 criou o campo de texto exatamente onde estava meu cursor.
Ā
Isso permite uma realocação fĆ”cil de campos dentro do formulĆ”rio. Cercando com as tags ālabelā de HTMLā¦
Feitas as alterações necessÔrias, só precisa salvar o formulÔrio.
Ā
Inserindo o formulƔrio na pƔgina
Para inserir o formulƔrio na pƔgina, edite a pƔgina desejada, e adicione o elemento indicado abaixo.
SerĆ” aberto um menu dropdown com os formulĆ”rios existentes. Vamos escolher āFormulĆ”rio de testeā. Salve as mudanƧas, e visualize as alteraƧƵes ou salve a pĆ”gina.
Ā
Visualizando a pĆ”ginaā¦
Ā
Configurando template de email de formulƔrio
Criado o formulƔrio, Ʃ hora de configurar o formato do email para recebimento do mesmo.
Vamos voltar para a edição do formulĆ”rio na seção mostrada no inĆcio de nosso manual, na aba destacada abaixo.
Ā
Primeiramente edite essas informaƧƵes iniciais; pode remover os campos conforme precisar.
Enquanto o formulĆ”rio estĆ” em fase de testes, Ć© bom inserir seu endereƧo de email institucional no campo āParaā, para receber os que forem enviados.
E na seção abaixo, temos o corpo de email. Repare como ele chama os campos do formulĆ”rio para preencher as informaƧƵes no email pelo nome; no caso entĆ£o, para que ele mostre o texto do meu campo customizado criado mais acima, preciso chamar a informação pelo campo ā[text-377]ā.
Ā
Em seguida, temos a seção de anexos, onde vocĆŖ disponibiliza arquivos para download que foram enviados. SĆ£o chamados da mesma forma que os campos acima. Um exemplo comum de aplicação seria um formulĆ”rio de āTrabalhe conoscoā, e o anexo seria o currĆculo do candidato.
Em seguida, só precisa salvar o formato do email.
Ā
SMTP, CRM Entries e envio do formulƔrio
Se o SMTP em seu Wordpress não estiver corretamente configurado, ele não farÔ o envio dos formulÔrios para o email desejado, disparando uma mensagem de erro.
Isso significa que o formulÔrio foi perdido?? Não! (Ufa!)
Dentro do plugin āCRM Entriesā, o formulĆ”rio fica disponĆvel para conferĆŖncia e extração de relatório. VocĆŖ verĆ” como fazer essa extração no tutorial do link a seguir: https://datacakebr.atlassian.net/wiki/x/AwAweQ .
Mas esta não é a situação ideal, visto que a mensagem de erro ainda aparece. O ideal é que sejam verificadas e corrigidas as configurações de SMTP do seu site.
Caso o SMTP esteja configurado corretamente, ele vai permitir o envio do email.
Caso precise configurar seu SMTP dentro do Wordpress, siga este tutorial: https://datacakebr.atlassian.net/wiki/x/FwAZgw
Ā
Esperamos que o tutorial tenha ajudado!
At.te. Equipe Datacake.