bento icon close

Sobre nosso editor de formulários

O Mailify Sunrise possui um editor de formulários.

Os formulários são muito úteis para coletar novos inscritos em seu site, registrar inscrições para um evento ou enviar um questionário para seus clientes.

Você encontrará todas as informações sobre os vários tipos de formulários, bem como seus vários métodos de integração na seção "Formulários" deste manual do usuário.

Nós iremos aqui focar no design do próprio formulário e nas muitas opções de formatação que podem ser aplicadas a ele.

Vamos rever cada elemento do editor de formulários:  Interface   |  Conteúdos   |  Estilos   |  Açoe

Preâmbulo

O editor de formulário é idêntico de um formulário para outro, independentemente do tipo de formulário selecionado de antemão.

A única exceção à regra é a opção "opt-in duplo" somente acessível quando cria um formulário de "Registro / atualização".

Você terá acesso ao FormBuilder na etapa "edição" durante o processo de criação de seus formulários, seja qual for o tipo que escolheu.

Por padrão, um formulário pré-formatado é proposto por Mailify Sunrise. Pode modificá-lo como desejar:

 

 

 

Interface

Com o Mailify Sunrise EmailBuilder, o editor de formulário baseia-se no princípio do Drag & Drop.

O painel direito permite modificar os conteúdos e os estilos do seu formulário, ou escrever uma mensagem de agradecimento para aqueles que o completaram.

É possível aumentar o tamanho do seu plano de trabalho para obter conforto de uso.

 

  • Aumente a largura da sua área de trabalho retraindo o painel direito

Clique neste botão, localizado na parte superior do painel direito para dobrar o painel. Esta ação será reversível ao clicar neste botão novamente.

Fullwidth framework

  • Aumente a altura do seu worktop mudando para o modo de tela cheia

Clique neste botão, localizado no canto superior direito do seu plano de trabalho, para ocultar a coluna esquerda e a barra de cabeçalho.

Fullscreen framework

Por padrão, o modo de exibição do seu plano de trabalho está na versão "desktop", ou seja, vê seu formulário como se fosse consultado em um computador.

Você pode visualizar a renderização do seu formulário na versão "Smartphone" clicando no botão "switch" localizado acima do seu plano de trabalho.

Form builder responsive design

Você também pode visualizar a renderização do seu formulário em uma página da Web clicando no botão no canto superior direito do seu plano de trabalho.

 

Conteúdo

Ao contrário do EmailBuilder, não precisa criar um bloco antes de fazer o upload de conteúdo.

O próprio formulário consiste em apenas um único bloco em que é possível depositar apenas o tipo de conteúdo do tipo "Pergunta".

Outros tipos de conteúdo podem ser descartados abaixo ou acima do formulário e representam em si mesmos um bloco de conteúdo. Não é possível, por exemplo, depositar uma imagem, texto ou um mapa dentro do formulário.

Perguntas  |  Imagen   |  Texto   |  Espaço   |  Separador   |  Imagem flutuante   |  Google Maps

 

Pergunta 

Este conteúdo é o único que pode depositar no seu formulário.

Permite que insira uma nova "pergunta". O título "Pergunta"pode ​​ser confuso, pois não é necessariamente uma interrogação. É mais uma informação que deseja dos seus contatos. Esta informação pode ou não ser obrigatória.

Para inserir este conteúdo, clique nele e arraste e solte-o diretamente na área de trabalho, dentro do recipiente principal do formulário. O contêiner é destacado quando está prestes a adicionar sua pergunta para dizer que pode deixá-lo lá.

Há outra maneira de criar uma nova pergunta: clique diretamente no botão "+" localizado na última pergunta do seu formulário.

Depois de adicionar uma nova pergunta, várias ações são possíveis: pode movê-la, excluí-la ou editá-la.

Para editar uma pergunta, clique no botão "Editar" que aparece quando passa o mouse sobre ela.

 

Uma nova janela intitulada "Propriedades da pergunta" aparecerá.


Para os formulários "Registro / atualização" deve estabelecer uma correspondência entre esta questão e um campo de sua lista de contatos, para que os dados inseridos pelas pessoas que preencham o formulário possam alimentar a coluna em questão. Por exemplo, se inserir um campo "Primeiro nome" em seu formulário, será necessário que os dados inseridos neste campo sejam direcionados ao campo "Primeiro nome" da sua lista de contatos.

Para os formulários "Evento" ou "Questionário", não é necessário combinar, seus dados não são adicionados à uma lista de contatos existente.

Janela "propriedades da pergunta" de um tipo de formulário "Registro / Atualização" VS. Tipos "Evento "ou " Questionário"

Aqui é onde poderá escolher o tipo de pergunta que deseja adicionar ao seu formulário:


Independentemente do tipo de campo selecionado, pode personalizar o nome do campo em seu formulário clicando duas vezes nele:

                   

Aqui é onde poderá escolher o tipo de pergunta que deseja adicionar ao seu formulário:

Independentemente do tipo de campo selecionado, pode personalizar o nome do campo em seu formulário clicando duas vezes nele:

 

Tipo "Campo de texto simples"


Este tipo de pergunta permite que insira um campo de entrada livre.

É particularmente adequado para respostas textuais que não requerem um formato específico, como nomes, sobrenomes ou endereços ...

Não é recomendado usar esse tipo de pergunta para solicitar um endereço de e-mail, por exemplo. Na verdade, é melhor verificar se as respostas dos seus contatos serão endereços de e-mail e responderão bem a um formato padrão. Para isso, há um tipo de pergunta "campo de e-mail".

Da mesma forma, não é recomendável usar esse tipo de campo para perguntas abertas. Existe um campo "campo multilinha" que permite exibir um campo de entrada maior que apenas um campo de texto simples.

 

Tipo "Número"

Este tipo de campo é adequado para inserir caracteres numéricos (por exemplo, "código postal" ou "número de rua"): somente os caracteres numéricos podem ser digitados neste tipo de campo.

Não use esse tipo de campo para inserir um número de telefone. Existe um campo tipo "Telefone" fornecido para este fim.

 

Tipo "campo de e-mail"

Este tipo de campo é adequado para inserir um endereço de e-mail.

A vantagem de associar esse tipo de campo e não um campo de texto simples é o seguinte: uma mensagem de erro será exibida quando uma pessoa não inserir um endereço de e-mail válido em seu formulário.

 

Tipo "Telefone"

Este tipo de campo é apropriado para inserir um número de telefone.

Seus contatos só poderão inserir conteúdo numérico neste campo.

 

Tipo "data"

Este tipo de campo é apropriado para a inserção de dados do tipo "data". Por exemplo, é útil se deseja solicitar uma data de nascimento.

Quando seleciona esse tipo de pergunta, um menu suspenso permite que determine o formato da data que mais lhe convier (d = dia, m = mês, y = ano).

 

Tipo "várias linhas"

Este tipo de campo é apropriado quando deseja solicitar informações de tipo de texto que podem ocupar várias linhas de escrita.

O canto inferior direito deste campo permite ampliar ou reduzir o tamanho da área de entrada conforme achar adequado.

 

 

Tipo "lista suspensa"

Este tipo de campo é apropriado quando deseja oferecer opções predefinidas aos seus contatos:

Você pode remover as opções clicando na cruz na frente de cada uma. Você também pode adicionar opções clicando no botão "+" à direita das opções.

A interpretação visual do seu menu suspenso será diferente quando seu formulário for publicado: ele não será apresentado como uma árvore (como acima), mas como uma lista suspensa (como abaixo).

Você pode alcançar o mesmo objetivo criando uma pergunta de escolha única. No entanto, a lista suspensa é mais apropriada quando possui um grande número de possíveis respostas. Você é livre para escolher o formato que melhor se adapta às suas necessidades.

 

Tipo "Escolha múltipla"

Este tipo de campo é apropriado quando quer oferecer várias opções de resposta possíveis aos seus contatos.

Você pode adicionar quantas escolhas de resposta quiser, clicando no botão "+".

Na janela "propriedades da pergunta" tem a opção de determinar se deseja exibir cada uma das opções uma após a outra ou uma acima da outra.

 

 

 

 

Tipo "Escolha única"

Este tipo de campo é apropriado quando quer oferecer várias opções de resposta aos seus contatos, mas eles devem selecionar apenas uma.

Como perguntas de múltipla escolha, pode adicionar tantas opções de resposta como quiser, e pode alinhar suas respostas uma após a outra ou uma acima da outra .

A grande diferença da "escolha múltipla" vem do fato de que um botão radial é inserido em vez de uma caixa de seleção, o que limita a escolha a uma única resposta.

 

Respostas obrigatórias ou opcionais


Quando edita uma pergunta, a opção "Resposta necessária" está disponível na parte inferior da janela "Propriedades da pergunta".

Se a opção estiver ativada, a questão será obrigatória e o formulário não poderá ser validado sem responder sua pergunta.

Se a opção estiver desativada, a questão será opcional e o formulário será validado sem que o contato tenha respondido.

 

 

 

Contenu image Imagem

Este conteúdo permite que insira uma imagem acima ou abaixo do formulário.

Para inserir este conteúdo, clique nele e arraste e solte-o diretamente na área de trabalho. O contêiner é destacado quando está prestes a adicionar seu conteúdo para dizer que pode deixá-lo lá.

Uma vez que o deposite, várias ações são possíveis nesse tipo de conteúdo quando passa o mouse sobre ele:

 Actions sur une image emailing

 

  • Escolher uma imagem permite selecionar uma imagem

Procurar: permite que selecione uma imagem navegando nos arquivos em seu computador

Banco de imagens: permite selecionar uma imagem do banco de imagens grátis do Mailify Sunrise

De um URL: permite que insira uma imagem inserindo o link de hospedagem de sua imagem

Inserir Variável: Se a sua lista de destinatários tiver uma coluna de "imagem" com links para imagens para cada destinatário, sua imagem será personalizada para cada um deles. Saiba mais sobre campos de personalização dinâmicos.

Choisir une image emailing

Imagem de clone: permite que crie uma duplicata de sua imagem. A nova imagem é automaticamente adicionada sob a imagem inicial, no mesmo recipiente.

Mover Imagem: permite que altere a localização atual da sua imagem. Arraste e solte a imagem em outro local no formulário.

Excluir imagem: permite que exclua a imagem do seu formulário. Um botão "confirmar" aparecerá quando clicar em "excluir a imagem". Terá que confirmar a exclusão.

Editar imagem: o botão "editar" aparece uma vez que inserir sua imagem. Quando clica neste botão, aparece uma janela "Propriedades da imagem". Também pode acessar diretamente as propriedades de sua imagem clicando nela.

Poderá então modificar as dimensões da imagem ajustando a largura e a altura (em pixels) da imagem. Um pictograma de cadeado permite que gerencie as dimensões da sua imagem enquanto mantém as proporções iniciais entre altura e largura (cadeado fechado) ou gerenciando essas dimensões independentemente uma da outra (cadeado desbloqueado). Recomendamos que evite esticar ou esmagar sua imagem alterando o tamanho depois de destravar o cadeado. Isso irá deformá-la e a renderização estética será prejudicada.

Também pode gerenciar o alinhamento da sua imagem dentro do bloco em que está incorporada: Alinhe sua imagem à esquerda, ao centro ou à direita do recipiente de acordo com suas preferências.

Finalmente, pode inserir um link clicável em sua imagem, bem como uma legenda (texto alternativo exibido em caso de não download de sua imagem pelo cliente de email do destinatário).


édition d'images avec Sarbacane Sunrise       Propriétés de l'image

  •  Retocar a imagem: quando clicar em "editar a imagem" e a janela "Propriedades da imagem" aparece , clique no botão" "Retoque" na parte superior da imagem. Você terá acesso ao editor de imagens integrado do Mailify Sunrise, que permitirá que faça uma ampla escolha de correções para sua imagem, a fim de melhorar a renderização visual.

 Retoucher une image

 

Contenu texte Texto

Este conteúdo permite que insira uma caixa de texto acima ou abaixo do formulário.

Para inserir este conteúdo, clique nele e arraste e solte-o diretamente na área de trabalho. O contêiner é destacado quando está prestes a adicionar seu conteúdo para dizer que pode deixá-lo lá.

Depois de ter largado a caixa de texto, várias ações permitem que personalize seu texto:

Quando clicar no seu texto, um editor aparece e permite que aplique uma formatação como em seu processador de texto usual, incluindo (da esquerda para a direita):

  • Alterar fonte
  • Aumentar / diminuir o tamanho da fonte
  • Coloque cor no seu texto
  • negrito
  • Itálico
  • Texto sublinhado
  • Bloquear texto
  • índice
  • Exposição
  • Aumentar / diminuir o espaçamento entre linhas
  • Alinhar o seu texto (esquerda, direita, centrado, justificado)
  • Insira uma list
  • Inserir uma lista numerada
  • Inserir um campo de personalização dinâmico
  • Aplicar um estilo (Título 1, Título 2, Parágrafo)
  • Aplicar uma cor de fundo no seu texto
  • Inserir uma imagem flutuante dentro do seu texto
  • Inserir um link
  • Excluir um link existente

Como outros conteúdos, pode mover, clonar ou excluir seus textos.

 

Contenu espace Espaço

Este conteúdo permite que insira um espaço vertical acima ou abaixo do formulário.

Para inserir este conteúdo, clique nele e arraste e solte-o diretamente na área de trabalho. O contêiner é destacado quando está prestes a adicionar seu conteúdo para dizer que pode deixá-lo lá.

Uma vez que soltou, há várias coisas que pode fazer com esse tipo de conteúdo ao passar o mouse sobre ele: pode ajustar a altura desse espaço vertical, de um mínimo de 10 pixels para um máximo de 100 pixels.

Insérer un espace vertical dans un emailing

Como outros conteúdos, você pode mover, clonar ou excluí-lo.

 

Contenu séparateur Separador

Este conteúdo permite que insira um separador horizontal acima ou abaixo do formulário.

Para inserir este conteúdo, clique nele e arraste e solte-o diretamente na área de trabalho. O contêiner é destacado quando está prestes a adicionar seu conteúdo para dizer que pode deixá-lo lá.

Uma vez que o deposite, várias ações são possíveis nesse tipo de conteúdo quando passa o mouse sobre ele:

Séparateur horizontal emailing

Em particular, você pode personalizar a cor, espessura e estilo do separador clicando no botão " Propriedades de separação ".

Propriétés d'une balise HR Html emailing

Como outros conteúdos, você pode mover, clonar ou excluí-lo.

 

Contenu image flottante Imagem flutuante

Este conteúdo permite que insira uma imagem flutuante, ou seja, uma imagem cercada por outro conteúdo (geralmente texto) abaixo ou acima do formulário.

Para inserir este conteúdo, clique nele e arraste e solte-o diretamente na área de trabalho. O contêiner é destacado quando está prestes a adicionar seu conteúdo para dizer que pode deixá-lo lá.

Uma vez que o deposite, várias ações são possíveis nesse tipo de conteúdo quando passa o mouse sobre ele:

 

Ao pairar sobre a imagem, aparece um ícone que simboliza uma engrenagem. Clique na engrenagem para inserir uma imagem.

Aparece um menu suspenso solicitando que insira uma imagem. Os modos de inserção são os mesmos que os descritos na seção relativa ao tipo de conteúdo "imagem".

Insérer une image flottante dans un emailing

Selecione a imagem de sua escolha com o método que melhor lhe convier.

Uma vez que está inserida, um botão "propriedade" aparece no menu suspenso quando clica em sua imagem.

Clique neste botão para acessar as configurações:

 Accéder aux propriétés d'une image flottante emailing

Uma nova janela de configurações aparecerá na tela:

Propriétés d'une image flottante

  • Retocar: permite acessar o editor de imagens Mailify Sunrise para fazer as correções desejadas
  • Largura / Altura: permite aumentar ou diminuir as dimensões da sua imagem. Um cadeado permite que aumente essas dimensões proporcionalmente (cadeado fechado) ou desproporcionalmente (cadeado aberto). No entanto, aconselhamos a evitar uma mudança desproporcional das dimensões da sua imagem, isso a tornará pouco atraente.
  • Alinhamento: permite que você coloque sua imagem no canto superior esquerdo ou no canto superior direito do seu conteúdo textual.
  • Margem: permite ajustar a margem em torno da sua imagem - quanto menor for sua margem, mais próximo será o texto da sua imagem.
  • Link: permite que insira um link na sua imagem para torná-lo clicável pelos seus destinatários. Preencha o URL de sua escolha neste campo.
  • Legenda: adicione um texto alternativo à sua imagem. Este texto não será visível no Mailify Sunrise, mas no caso de as imagens do seu formulário não puderem ser exibidas, esse texto alternativo será exibido no lugar deles. Descreva, na melhor das hipóteses, o que sua imagem representa no campo fornecido para esse fim.

Como outros tipos de conteúdo, a imagem flutuante pode ser duplicada, movida ou excluída usando os botões de ação que aparecem quando o conteúdo é transmitido.

 

Contenu Google Maps Google Maps

Este conteúdo permite que insira um mapa (gerado pelo Google Maps) abaixo ou acima do seu formulário.

Um mapa é inserido automaticamente ao criar um formulário do tipo "Evento".

Para inserir este conteúdo manualmente, clique nele e arraste e solte-o diretamente na área de trabalho. O contêiner é destacado quando está prestes a adicionar seu conteúdo para dizer que pode deixá-lo lá.

Uma vez solto, há várias coisas que pode fazer sobre esse tipo de conteúdo quando passa o mouse sobre ele:

 Google map into an email

Clique em "Gerar mapa" para validar a criação da imagem do Google Maps.

Não é um mapa interativo, mas instantâneo da localização do endereço especificado.

Carte Google Maps dans un emailing

Um botão "Editar imagem" permite acessar as configurações da imagem.

Paramètres de l'image Google Maps

  • Dimensões: se "largura total" for selecionada, a imagem ocupará 100% da largura máxima alocada, ou seja, 100% da largura do recipiente. Se "Personalizado" estiver selecionado, pode ajustar a largura e a altura da sua imagem como quiser. O cadeado permite que ajuste as dimensões da largura em proporção à altura para que não estique ou esmague sua imagem. Você pode desbloquear o cadeado para ajustar a largura ou altura independentemente um do outro, mas isso não é recomendado por razões estéticas.
  • Alinhamento: uma vez que o tamanho da sua imagem é ideal, a opção "Alinhamento" permite que posicione sua imagem à esquerda, à direita ou no centro do seu contêiner. disponível apenas se escolheu uma dimensão "personalizada" (no caso de uma dimensão de" largura total ", a questão do alinhamento do seu mapa não surge uma vez que ocupa toda a largura do seu recipiente).
  • Link: Pode fazer a imagem do seu mapa clicável inserindo um link. Por exemplo, pode enviar seus destinatários para suas informações de endereço no Google Maps para que possam navegar nela e, opcionalmente, traçar uma rota a partir da sua localização atual (este é o link padrão que é inserido pelo Mailify Sunrise). Também pode optar por enviá-los ao seu site. Pode customizar o link como quiser.
  • Legenda: adicione um texto alternativo à sua imagem. Este texto não será visível no Mailify Sunrise, mas no caso de as imagens do seu formulário não puderem ser exibidas, esse texto alternativo será exibido no lugar delas. Descreva o que sua imagem representa no campo " legenda ". No caso da sua imagem do Google Maps, você pode, por exemplo, lembrar o endereço que usou para gerar seu mapa.

Como outros tipos de conteúdo, o Google Maps pode ser duplicado, movido ou excluído graças aos botões de ação que aparecem ao pairar sobre o conteúdo.

 

Estilo

Pode personalizar a aparência do seu formulário modificando os atributos "Estilos" localizado no painel direito do editor de formulários.

  • Fundo: permite que altere a cor de fundo em torno de seu formulário.
  • Fundo de formulário: permite que altere a cor de fundo do próprio formulário.
  • Fundo dos campos do formulário: permite que personalize a cor interna dos campos do formulário.
  • Borda do campo de formulário: permite que personalize a cor da borda do campo do formulário.
  • Etiquetas e opções: permite que personalize a cor dos rótulos acima dos campos, bem como opções quando é uma questão de escolha múltipla ou uma questão de escolha única.
  • Placeholder: permite que personalize a cor do texto organizado em seu campo, esperando para inserir o texto do seu contato.
  • Container - Bordas arredondadas: arredonda os cantos de seu formulário.
  • Container - sombra: adicione sombra ao seu formulário.
  • Campos - Bordas arredondadas: arredonda os ângulos.
  • Campos - sombra: adicione uma sombra em seus campos de etrada ou fora dos campos de entrada.

Exemplo de formulário criado com Mailify Sunrise

 

Açao

A seção "Ação" do painel direito permite que configure uma mensagem que será exibida uma vez que o formulário tenha sido validado ou direcionado a pessoa para a página escolhida.

 

No caso de um formulário "registro / atualização", também tem a possibilidade de adicionar uma confirmação de registro por meio de opt-in duplo. Um e-mail de confirmação de registro para a pessoa que acabou de se registrar ao preencher o formulário é enviado.

O duplo opt-in designa uma confirmação dupla de registro para seu e-mail. Ele se opõe ao single opt-in, o que significa uma confirmação única. Ele permite que melhore a qualidade dos registros que gera e, assim, melhore a qualidade do seu banco de dados. Evitará entradas maliciosas, irrefutáveis, não solicitadas ou registros gerados por bots ("robots").

Para ativar o duplo opt-in, ative o botão do interruptor localizado na frente da "verificação do registro".

  • Na inserção de um novo contato: nesta seção, preencha o título e o texto da mensagem que será exibida na tela para as pessoas que preencheram seu formulário para que eles saibam que receberão um e-mail de confirmação de registro e que terão que clicar no link presente neste e-mail para validar seu registro definitivamente.
  • E-mail de confirmação automática: configura o e-mail que será enviado automaticamente quando seu formulário for enviado. Digite o assunto do seu e-mail, o nome do remetente, o e-mail do remetente e um e-mail de resposta.