Como criar campos responsivos nos formulários

Uma forma de melhorar a experiência dos usuários é criar campos responsivos nos seus formulários, pois eles se adaptam ao tamanho da tela e facilitam a visualização.

Veja como criar um botão responsivo no exemplo abaixo, usando o botão Enviar como referência:

Ele se adapta ao tamanho da tela do lead.

Acesse a página de Criação de Formulários e clique no botão ENVIAR e depois na opção DIMENSÕES.

Note que a unidade de medida selecionada é o Pixel, que é uma unidade estática, ou seja, que não se adapta corretamente aos diversos tamanhos de tela dos dispositivos que os usuários podem usar.

Botão que usaremos como exemplo.

O mesmo procedimento pode ser feito para outros componentes.

Na seleção de medias você encontrará outras opções, mas a melhor opção para esse caso é usar a unidade de medida de Porcentagem, pois ela é uma unidade dinâmica que se ajusta às telas dos usuários. É importante manter a largura em 100%.

Observe que o botão Enviar se ajusta as bordas do formulário!

Para verificar como o botão ficará nas diferentes telas, nós oferecemos a opção de Visualização em Formato para tablet, celular e computador. Assim você poderá ter uma ideia de como será o resultado final.

O mesmo pode ser feito para tablets e outros formatos de tela.

Agora seu botão já está pronto para se adaptar às diferentes telas.

Last updated

Change request #679: Como criar um template de mensagens