O recurso de solicitação de cotação é usado para criar formulários que seus clientes em potencial podem usar para solicitar uma cotação ou informações sobre os serviços ou produtos que sua empresa oferece, o recurso de solicitação de cotação permite adicionar diferentes tipos de campos que podem ser personalizados para sua necessidades de negócios.

Por exemplo, se sua empresa oferece design de site, seus clientes podem solicitar uma cotação para um design de site por meio do formulário que você criou anteriormente. Normalmente os formulários terão perguntas mais gerais como “Qual é o seu orçamento”, “Urgência”, “Tipo de site”, etc. e com base nas informações que o cliente inseriu no formulário, você pode criar uma cotação e enviá-la ao cliente.

Os formulários podem ser enviados diretamente para o cliente como um link direto ou você pode incorporar o formulário via iframe diretamente nas páginas do seu site existente, por exemplo, você pode ter um link de menu no site da empresa existente chamado “Solicite uma cotação” e nesta página você pode incorporar o formulário iframe.

Criar formulários de solicitação de cotação #

O primeiro passo é criar um formulário de solicitação de cotação. Você pode criar um número ilimitado de formulários de solicitação de cotação. Para fazer isso, quando estiver logado como usuário administrador, siga as etapas abaixo.

• Clique parametros depois pedido de Orçamento→Forms.
• Clique Novo formulário .
• Adicione o nome do formulário, exemplo: “Solicitação de cotação do site".
• idioma – O idioma atualmente é usado apenas para mensagens de validação.
• O texto do botão enviar- Ficará na parte inferior onde o usuário deverá clicar para enviar o formulário Exemplo Pedir uma cotação ou Entre em contato fique à vontade para adaptá-lo às suas necessidades.
• Mensagem a ser exibida após o envio bem-sucedido do formulário – Esta mensagem será exibida após o envio bem-sucedido do formulário.
  
• Estado – Qual status terá o pedido de orçamento após ser submetido com sucesso em seu espaço Djaboo.
  
• Responsável – Atribua automaticamente o pedido de orçamento a um membro específico da equipe.
  
• Configurações de notificação – Todos os usuários com base no tipo de notificação serão notificados por meio de uma notificação incorporada no Djaboo e, adicionalmente, o membro responsável pela solicitação de cotação receberá uma notificação por e-mail se estiver em parametros-> Modelos de e-mail -> Pedido de cotação atribuído (enviado para Pessoal) não está marcado como desabilitado.
  
• Recaptcha – Você pode usar o Google Recaptcha para evitar spam. O campo para Google Recaptcha só aparecerá se você tiver configurado previamente o chaves recaptcha .

Depois de criar o formulário, 2 novas guias serão exibidas na área do formulário Construtor de formulários e Código de integração.

• Form Builder – O local onde você cria o formulário e ajusta todos os campos necessários.
• O código de incorporação é o código que você precisará colocar em seu site para que o formulário seja exibido, observe que no link você poderá ver que cada um possui uma chave exclusiva.
  

Adicionar campos ao formulário #

Para adicionar um campo ao formulário, basta arrastar o campo para a direita na área do formulário, observe que o campo E-mail deve aparecer no formulário e também deve ser marcado como campo obrigatório.

Personalizar campos #

Você pode personalizar rótulos, adicionar texto de ajuda, espaços reservados e torná-los obrigatórios. Ao arrastar o campo para a área do formulário, basta passar o mouse sobre o campo no canto superior direito, você poderá ver 3 botões (editar, copiar e excluir)

Depois de personalizar o formulário, clique no botão no canto inferior esquerdo REGISTRO e clique na guia Embed Code para obter o código que você precisa adicionar ao seu site. O código será colocado como um iframe e você poderá ajustar a largura e a altura diretamente no trecho de código fornecido.

Style #

Se você precisar personalizar a cor dos campos de entrada de acordo com seu site, crie um arquivo custom.css em seu site e aplique os estilos necessários.

Exemplo de alteração da cor da borda das entradas:

body.estimate-request-form input {
   border-color:red;
}

Exemplo de alteração da cor de fundo do botão enviar:

body.estimate-request-form #form_submit {
   background:red;
}

body.estimate-request-form #form_submit:hover,
body.estimate-request-form #form_submit:active {
   background:green;
}

Incluir o logotipo no formulário #

Para incluir o logotipo da sua empresa no formulário, você pode compartilhar ou incorporar a URL com o parâmetro query string conforme mostrado abaixo:

https://votre-entreprise.djaboo.appform-url?with_logo=1https://votre-entreprise.djaboo.app/form-url?with_logo=1

Compartilhamento de link direto #

Os formulários podem ser compartilhados diretamente com seus clientes sem realmente incorporar o formulário em seu site, esse recurso é útil, por exemplo, se você deseja incluir um link em e-mails, SMS, etc.

Para que o Djaboo saiba que o link do formulário é compartilhado diretamente e não embutido em um iframe, você deve especificar a string de consulta da URL, neste caso o Djaboo fornecerá um estilo melhor para o formulário.

https://votre-entreprise.djaboo.app/form-url?with_logo=1&styled=1

Crie layouts de formulário com várias colunas #

Por padrão, os campos do formulário serão adicionados em uma única coluna de largura total do documento, se você quiser personalizar o formulário e exibir os campos em várias colunas, adicionamos a capacidade de conseguir isso com classes personalizadas aplicadas ao campo que você pode adicionar para 12 colunas em 1 linha.

No exemplo a seguir, criaremos 2 campos em 2 colunas e 1 linha.

Lembre-se de que as colunas não serão aplicadas no construtor de formulários, apenas quando o formulário for exibido acessando o link de incorporação ou estiver em um iframe.

Register o formulário clicando no botão Salvar e visualize o formulário no link de incorporação para ver o resultado final.

Como mencionado anteriormente, você pode adicionar até 12 colunas, neste caso, form-col-6 + form-col-6 = 12, se quiser adicionar 3 colunas, aplique a classe form-col-4 em 3 campos ( form -col-4*3 campos serão 12 e os campos caberão no documento) que são um por um em ordem.

Como na maioria dos casos você estará incorporando o formulário em um pequeno contêiner/parte do seu site, a grade de bootstrap do CSS sempre exibirá as colunas das novas linhas (não divididas em 2 colunas), nesse caso, considere adicionar outra classe extra para contêiner pequeno, por exemplo, se você adicionou a classe form-col-6 , adicione outra classe para área pequena form-col-xs-6 , clique aqui para verificar como deve ficar.