Atenção!

Este artigo contém código CSS e destina-se a programadores. Oferecemos este código como uma cortesia, mas não fornecemos suporte para personalizações de código ou desenvolvimento de terceiros.

Para orientação adicional, consulte o tutorial da WPBeginner sobre como adicionar CSS personalizado.

Ignorar

Como Ocultar Rótulos de Escolha de Imagem com WPForms

Introdução

Pretende ocultar os rótulos das escolhas de imagem nos campos de formulário Múltipla Escolha e Caixa de Seleção? Utilizar a opção de exibir imagens para estes campos em vez de apenas rótulos é uma ótima forma de captar a atenção do seu visitante, mas talvez queira deixar as imagens falarem por si e remover os rótulos que aparecem por baixo destas imagens? Usando um pequeno trecho de CSS pode facilmente ocultar os rótulos destas imagens e neste tutorial, vamos mostrar-lhe exatamente como!

Criar o seu formulário

Para começar, vamos criar um novo formulário e adicionar os nossos campos. Como já sabemos que queremos usar imagens para o nosso campo Caixa de Seleção, vamos adicionar este campo e as imagens correspondentes.

Se precisar de alguma assistência na criação do seu formulário, consulte este guia útil. Além disso, se também precisar de assistência sobre como configurar um campo usando as Escolhas de Imagem, reveja esta documentação.

adicione as suas escolhas de imagem de Caixa de Seleção ao seu formulário

Adicionar CSS para ocultar rótulos de escolhas de imagem

Agora que o formulário foi criado, pode ver os rótulos por baixo das imagens.

pode ver os rótulos exibidos por baixo das imagens

Como queremos ocultar estes rótulos, vamos adicionar algum CSS para os ocultar.

Se precisar de ajuda para adicionar CSS ao seu site, consulte este tutorial.

Simplesmente copie e cole este CSS no seu site.

form.wpforms-form .wpforms-field-container ul.wpforms-image-choices span.wpforms-image-choices-label {
    display: none;
}

Este CSS não só ocultará os rótulos que aparecem por baixo das imagens, mas também removerá qualquer margem (espaçamento) que seja aplicada automaticamente por baixo das imagens.

Agora verá que os rótulos já não estão lá

Pretende também remover o espaço em branco que é colocado à volta das escolhas de imagem? Dê uma vista de olhos ao nosso artigo sobre Como Remover Espaço em Branco de Escolhas de Imagem.