Atenção!

Este artigo contém código CSS e destina-se a desenvolvedores. 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.

Dispensar

Como Ocultar Rótulos de Escolha de Imagem com WPForms

Introdução

Você gostaria de ocultar os rótulos das opções de imagem nos campos de formulário Múltipla Escolha e Caixa de Seleção? Usar a opção de exibir imagens para esses campos em vez de apenas rótulos é uma ótima maneira de capturar a atenção do seu visitante, mas talvez você queira deixar as imagens falarem por si e remover os rótulos que aparecem sob essas imagens? Usando um pequeno trecho de CSS, você pode facilmente ocultar os rótulos dessas imagens e, neste tutorial, mostraremos exatamente como!

Criando seu formulário

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

Se precisar de ajuda para criar seu formulário, consulte este guia útil. Além disso, se você também precisar de ajuda sobre como configurar um campo usando Opções de Imagem, revise esta documentação.

adicione as opções de imagem da sua Caixa de Seleção ao seu formulário

Adicionando CSS para ocultar rótulos de opções de imagem

Agora que o formulário foi criado, você pode ver os rótulos sob as imagens.

você pode ver os rótulos sendo exibidos sob as imagens

Como queremos ocultar esses rótulos, vamos adicionar algum CSS para ocultá-los.

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

Simplesmente copie e cole este CSS em seu site.

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

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

Agora você verá que os rótulos não estão mais lá

Você gostaria também de remover o espaço em branco ao redor das opções de imagem? Dê uma olhada em nosso artigo sobre Como Remover Espaço em Branco de Opções de Imagem.