Formulários

O Editor de formulários é uma ferramenta intuitiva que permite criar vários tipos de formulários web para interagir com os visitantes do site ou recolher informações do utilizador. Com uma interface intuitiva semelhante ao Editor de Texto e Imagem, mas com opções de personalização adicionais, pode projetar e configurar formulários tais como formulários de feedback, formulários de subscrição, pesquisas e muito mais.

Adicionar um formulário ao seu site

1. Navegue até ao separador Construir no menu esquerdo e selecione a categoria Formulários.
2. Arraste e solte o elemento de formulário no local pretendido da página. O espaço reservado azul indicará o local de aplicação disponível mais próximo.

Componentes do formulário

1. Elementos: Configure o conteúdo, incluindo campos de formulário, caixas de seleção, botões de opção e o botão de chamada para ação.
2. Definições: Defina o que acontece no envio do formulário, como o envio de dados para um e-mail ou base de dados.

Elementos do formulário

1. Campo de texto

O Campo de Texto permite que os utilizadores insiram entradas de texto curtas e de linha única no formulário.

Tipos de campo
A configuração Tipo determina o tipo de dados que os utilizadores podem inserir:

- Texto – Exibe a entrada exatamente como escrita.
- Palavra-passe – Oculta os carateres escritos e exibe-os como *** (por exemplo, para palavras-passe).
- Oculto – Armazena informações relacionadas ao sistema (por exemplo, detalhes do referenciador ou do navegador) ou dados pré-preenchidos que os utilizadores não devem ver.
- Ficheiro* – Permite que os visitantes carreguem imagens, áudio, vídeo ou outros ficheiros. Os ficheiros enviados geram um e-mail com uma ligação de transferência clicável.

Opções de personalização
- Nome – Um identificador único para referenciar o campo dentro do editor de formulário e em e-mails ou entradas de blog gerados pelo formulário.
- Largura – Ajuste a largura do campo ao inserir um valor ou arrastar os controlos de redimensionamento.
- Comprimento máximo – Define o número máximo de carateres que o campo pode aceitar.
- Validar como – Define o tipo de conteúdo necessário (por exemplo, um campo de e-mail deve conter um endereço de e-mail devidamente formatado). Se a entrada for inválida, os utilizadores verão uma mensagem para a corrigir.
- Dica – Apresenta texto auxiliar quando os utilizadores clicam dentro do campo, fornecendo orientações ou exemplos.
- Valor padrão – Pré-preenche o campo com um valor predefinido que os utilizadores podem modificar.

Carregamentos de ficheiros*

- Para armazenar os ficheiros carregados, o formulário deve estar ligado a uma base de dados.
- Os ficheiros armazenados na base de dados permanecerão acessíveis e contarão para o limite de armazenamento da conta.
- As ligações de ficheiros enviadas por e-mail não usam armazenamento, mas expiram após 30 dias

2. Área de Texto

O campo de formulário Área de Texto é semelhante ao Campo de Texto, mas permite uma entrada de texto mais longa e com várias linhas.

Opções de personalização
Além do que é idêntico ao Campo de Texto - Nome, Etiqueta, Largura, Dica, Validar como e Valor padrão, existem as seguintes opções para a Área de Texto:

- Altura – Ajuste a altura da área de texto ao alterar o número no campo de altura ou arrastar os controlos de redimensionamento da área de texto.
- Quebra automática – Define como o texto é apresentado quando enviado em e-mails ou apresentado em fóruns/blogs.

• Padrão – Usa as configurações de quebra automática de texto padrão do navegador ou do cliente de e-mail.
• Desativado – Desativa a quebra automática de texto, para que o texto não seja quebrado em novas linhas quando digitado.
• Físico – Apresenta o texto exatamente como foi quebrado na Área de Texto.
• Virtual – Permite que o cliente de e-mail decida como o texto será quebrado.

3. Campo Selecionar

O campo Selecionar permite que os utilizadores escolham a partir de uma lista predefinida de opções. Pode ser apresentado como um menu pendente ou uma lista, dependendo da configuração selecionada.

Opções de personalização

- Tipo – Define como as opções são apresentadas:
     - Menu – Apresenta uma lista pendente onde os utilizadores podem selecionar uma opção.
     - Lista – Mostra todas as opções disponíveis numa lista vertical.
- Opções – Representa as opções selecionáveis no campo.
    - Nome da opção – O texto apresentado na lista pendente ou na lista vertical.
    - Valor da opção – Os dados reais enviados em e-mails quando a opção está selecionada.
- Pedido e gestão – Use as setas para cima/para baixo para reorganizar as opções, excluir opções indesejadas ou definir uma seleção padrão que aparece quando o formulário é carregado.

4. Caixas de seleção

As caixas de seleção permitem que os utilizadores selecionem várias opções de uma lista ou ativem ou desativem uma única opção. São úteis para apresentar seleções de escolha múltipla em que pode ser escolhida mais do que uma opção.

Opções de personalização
- Nome – O identificador exclusivo para a caixa de seleção, usado no Editor de Modelo de Formulário, e-mails e entradas de blog. Considere-o como a pergunta a que os utilizadores estão a responder ao marcar ou desmarcar as caixas de seleção.
- Valor – Representa a resposta selecionada. Por exemplo, se o valor da caixa de seleção estiver definido como "Sim", marcar a caixa significa que o utilizador respondeu afirmativamente.
- Selecionado por predefinição – Se estiver ativada, a caixa de seleção será pré-selecionada quando o formulário for carregado.
- Obrigatório – Requer que os utilizadores marquem a caixa antes de enviar o formulário. Isto é útil para caixas de seleção de acordos, tal como exigir que os utilizadores aceitem os Termos e Condições antes do envio.

5. Botões de opção

Os botões de opção são usados quando apenas uma opção pode ser selecionada numa lista predefinida. Ao contrário das caixas de seleção, selecionar um botão de opção desmarca automaticamente qualquer outra opção no mesmo grupo.

Opções de personalização
- Nome do Grupo – Todos os botões de opção que representam escolhas para a mesma pergunta devem pertencer ao mesmo grupo. Apenas um botão por grupo pode ser selecionado de cada vez.
- Valor – Representa a escolha da resposta. Por exemplo, se a pergunta for "Gosta do meu site?", o nome do grupo pode ser "Gostadomeusite", com opções de valor Sim, Não e Precisa de ajustes. Se um utilizador selecionar Sim, a resposta enviada aparecerá como: Gostadomeusite: Sim.
- Estado padrão – Permite pré-selecionar um botão de opção quando o formulário é carregado.
- Obrigatório – Requer que o utilizador selecione uma opção antes de enviar o formulário.

6. Formulário de comentários
O Editor de formulários inclui um assistente de Formulário de feedback interno, que pode ser facilmente adicionado ao selecionar o ícone F.

Este formulário vem pré-configurado com todos os campos necessários para enviar comentários, incluindo um botão Chamada para ação. Os campos são definidos com opções predefinidas, mas pode personalizá-los conforme necessário para melhor atender às suas necessidades.

7. Mensagens de sucesso/erro
Após o envio do formulário, o sistema apresenta uma mensagem de sucesso ou erro. Pode controlar o posicionamento dessas mensagens ao especificar a respetiva localização no editor.

Use o ícone Informações para selecionar onde pretende que as mensagens apareçam. Nas Propriedades do Formulário, quando as Opções Avançadas estão ativadas, também pode personalizar a Mensagem de Sucesso. Se o campo for deixado em branco, a mensagem de sucesso padrão será apresentada. No entanto, se preferir, pode inserir uma mensagem personalizada, nas Propriedades do formulário, que será mostrada aos visitantes após o envio bem-sucedido do formulário.

8. Botão Chamada para ação
O botão Chamada para ação (CTA, Call-to-Action) é um elemento crucial do formulário, pois permite que os utilizadores enviem as respetivas contribuições e concluam as ações pretendidas do formulário. Sem ele, o envio do formulário não é possível.

Para inserir um botão CTA, localize o ícone na secção Elementos inseridos da barra de ferramentas do Editor de formulários e clique no ícone. Uma vez adicionado, clique no botão para o configurar como um botão de envio. No menu pendente Ligações, selecione {Enviar formulário} para ativar o envio do formulário.

Se precisar de um botão de reposição, pode criar um seguindo os mesmos passos e selecionando {Repor}. Além disso, o painel direito fornece um campo editável onde pode personalizar o texto da legenda do botão para corresponder às necessidades do formulário.

Personalização e propriedades do botão Chamada para ação

- Legenda e sub-legenda do botão: Defina o texto principal e o subtexto opcional exibidos no botão.
- Tamanho: Escolha entre botões pequenos, médios ou grandes.
- Largura mínima: Defina uma largura mínima do botão para criar consistência na disposição.
- Legenda e sub-legenda da colocação do rato sobre o botão: Especifique o texto alternativo que aparece quando os utilizadores colocam o rato sobre o botão.
- Transição do texto: Se estiver definida uma legenda para quando coloca o rato sobre o botão, selecione um efeito de transição para uma alteração visual suave.
- Efeito de destaque: Adicione um efeito de animação que é ativado 3 segundos após o carregamento da página e se repete a cada 30 segundos.
- Cor: Selecione entre três cores de botão predefinidas.
- Alinhamento: Alinhe o botão dentro do conteúdo (esquerda, centro ou direita).
- Preenchimento: Ajuste o preenchimento do botão em píxeis para criar um espaçamento ideal.
- Ícone do botão: Escolha um ícone da Biblioteca de Imagens de Stock ou carregue uma imagem personalizada.
- Ícone de rato colocado sobre o botão: Opcionalmente, adicione um ícone diferente que aparece ao passar o rato.
- Localização do ícone: Posicione o ícone antes ou depois da legenda do botão.

Definições do formulário

1. Página Seguinte
Especifique a página que deve ser aberta após o envio bem-sucedido do formulário. Pode ser uma página dedicada a um "Agradecimento" ou qualquer outra página relevante no seu site. Por predefinição, o formulário é definido para manter os utilizadores na mesma página após o envio bem-sucedido. Para alterar, escolha a página pretendida através do Tipo de Ligação.

2. Enviar para e-mail
Ative a opção Enviar para e-mail para receber no seu e-mail os formulários enviados pelos visitantes do seu site. Isto abre outras opções:

- Para e-mail – Indique o endereço de e-mail onde os envios de formulário devem ser entregues, por exemplo, [e-mail].
- Do e-mail – Para garantir a entrega dos envios de formulários, desativamos a opção de especificar o endereço de e-mail do remetente.
- Assunto do e-mail – Defina a linha de assunto do e-mail (por exemplo, "Novo Pedido de Informação"). Também pode usar carateres especiais $xxxxx$ para personalizar o assunto com base na entrada do utilizador.

3. Editor de formato e modelo de e-mail
Escolha o formato do e-mail:

- Simples – Envia e-mails de apenas texto, retirando qualquer formatação.
- HTML – Envia e-mails formatados, desde que o seu cliente de e-mail suporte HTML.

Para esquemas de e-mail personalizados, selecione Usar modelo, que abre o Editor de modelos:

- O Editor de modelos funciona como um editor simplificado de texto e imagem.
- Use a lista pendente Valor para inserir espaços reservados correspondentes aos campos de formulário.
- Depois de guardar, cada envio de formulário irá gerar um e-mail com base na estrutura do modelo.

4. Enviar E-mail de Confirmação
Esta funcionalidade envia uma resposta automática aos visitantes a confirmar o seu envio.

- Para e-mail – Indique o endereço de e-mail onde os envios de formulário devem ser entregues, por exemplo, [e-mail].
- Do e-mail – Para garantir a entrega dos envios de formulários, desativamos a opção de especificar o endereço de e-mail do remetente.
- Assunto do e-mail – Defina a linha de assunto do e-mail (por exemplo, "Novo Pedido de Informação").
- Conteúdo da mensagem – Ative através de Usar modelo > Edição para abrir o Editor de modelo de texto, onde pode personalizar a mensagem de confirmação. Use Unir etiquetas para inserir dados de campo de formulário (por exemplo, $Email$).

5. Enviar para base de dados
Ative a opção Enviar para base de dados para armazenar os dados enviados em formulário numa base de dados hospedada no site. O formulário cria automaticamente uma base de dados dedicada com as colunas necessárias correspondentes aos nomes de campo de formulário e tipos de dados. Também pode usar uma base de dados importada, mas verifique se tem nomes e tipos de coluna correspondentes.

Configurações adicionais:
- Requer confirmação – Envia um e-mail com uma ligação de confirmação que os utilizadores devem clicar para validar o seu envio.
- Exigir aprovação – Notifica um moderador por e-mail, exigindo que aprove ou rejeite o envio antes que seja armazenado. Isto ajuda a evitar spam ou envios acidentais.

Para obter detalhes adicionais, consulte o tutorial da aplicação Editor de base de dados.