### [Exibir o seu formulário numa única linha](https://wpforms.com/docs/how-to-display-your-form-in-a-single-line/) **Publicado:** 23 de novembro de 2023 **Autor:** Umair Majeed **Excerto:** Saiba como exibir todos os campos do seu formulário numa única linha. **Conteúdo:** Gostaria que os campos do seu formulário fossem exibidos numa única linha? Ter o seu formulário num layout de linha única pode ajudá-lo a colocá-lo em áreas chave do seu site (como a secção superior da sua página inicial) para obter a máxima exposição. Neste tutorial, vamos mostrar-lhe como exibir o seu formulário numa única linha. **Nota:** Se preferir uma opção simples de arrastar e soltar para personalizar o layout do seu formulário, sugerimos a utilização do [campo de Layout](https://wpforms.com/docs/how-to-use-the-layout-field-in-wpforms/). No entanto, a classe `inline-fields` abordada neste tutorial ainda é suportada e é recomendada se pretender alinhar o botão de envio na mesma linha que os campos do seu formulário. --- Para o nosso exemplo, vamos criar um formulário com três campos: **Nome**, **Telefone** e **Email**. Para exibir os campos do formulário numa única linha, navegue até **Definições » Geral** no seu construtor de formulários e adicione a classe CSS `inline-fields` ao campo **Classe CSS do Formulário**. **Nota:** Tenha em atenção que a utilização da classe `inline-fields` no WPForms pode, por vezes, entrar em conflito com os estilos do tema do seu WordPress. Como resultado, a aparência pode não corresponder às suas expectativas. Em seguida, para reduzir a altura do seu formulário, abra a secção **Avançadas** de cada campo e selecione a opção **Ocultar Rótulo**. Em seguida, vamos configurar algum texto de placeholder para fornecer orientação aos utilizadores. Para o nosso exemplo, adicionaremos **Email** como texto de placeholder para o nosso campo de Email. **Nota:** Se pretender alterar a aparência do botão de envio para se adequar ao estilo do seu formulário, pode seguir [o nosso guia sobre como personalizar o botão de envio](https://wpforms.com/docs/how-to-customize-the-submit-button/). Eis como o formulário ficará no frontend do site: Por favor, ative o JavaScript no seu navegador para completar este formulário. Nome Email Telefone Enviar **Nota:** Se procura outro exemplo ou um modelo pronto a usar para um formulário de linha única, consulte o nosso [Modelo de Formulário de Inscrição de Newsletter em Linha](https://wpforms.com/templates/inline-newsletter-signup-form/). É tudo! Agora pode criar formulários que serão exibidos numa única linha. Em seguida, gostaria de receber uma cópia das informações enviadas pelos seus utilizadores através dos seus formulários? Certifique-se de que consulta o nosso tutorial sobre [configuração de notificações de formulário](https://wpforms.com/docs/setup-form-notification-wpforms/ "Como Configurar Notificações de Formulário no WPForms") para mais detalhes. **Categorias:** Estilização, Estilização e Personalização ---