CriaĆ§Ć£o de formulĆ”rios (Contact 7)
- Gabriel Sacata Aranda
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.