Como Localizar o ID do Formulário e o ID do Campo

Ao usar trechos de código personalizados ou CSS com o WPForms, muitas vezes precisará de encontrar IDs específicos de formulários e campos. Estes IDs ajudam a direcionar exatamente o formulário ou campo que deseja personalizar.

Este guia mostrar-lhe-á as formas mais rápidas de encontrar estes IDs.

Encontrar o ID do seu Formulário

A forma mais simples de encontrar rapidamente o ID de um formulário é na página Visão Geral dos Formulários. Para aceder a esta página, vá a WPForms » Todos os Formulários e procure a coluna Shortcode. O seu ID de formulário é o número dentro do shortcode.

Por exemplo, a captura de ecrã abaixo indica o shortcode [wpforms id="1233"]. O ID para este formulário seria 1233.

Encontrar o ID do seu Campo

Para encontrar o ID de um campo específico, edite o seu formulário no Construtor de Formulários. Em seguida, clique no campo que deseja identificar e olhe para o painel Opções do Campo à esquerda. O ID do campo aparece no topo do separador Geral.

Por exemplo, se vir “Linha de Texto Única (ID #15)”, o seu ID de campo é 15.

Como Usar Estes IDs

Quando vir trechos de código na nossa documentação, precisará de substituir os IDs de exemplo pelos seus IDs reais. Eis como usá-los corretamente:

• Para IDs de formulário, substitua SEU-ID-DE-FORMULÁRIO pelo seu número de formulário real. Por exemplo, se o seu ID de formulário for 561, altere wpforms-SEU-ID-DE-FORMULÁRIO para wpforms-561
• Para IDs de campo, substitua SEU-ID-DE-CAMPO pelo seu número de campo real. Por exemplo, se o seu ID de campo for 13, altere field_SEU-ID-DE-CAMPO para field_13.

Portanto, se o seu ID de formulário for 999 e o seu ID de campo for 4, alteraria:

jQuery('#wpforms-123-field_13')

para:

jQuery('#wpforms-999-field_4')

Estes IDs são essenciais para muitas personalizações:

• Os IDs de formulário são necessários ao aplicar CSS a um formulário específico, adicionar validação personalizada ou criar funcionalidades específicas do formulário.
• Os IDs de campo são necessários ao estilizar campos específicos, adicionar regras de validação personalizadas ou criar cálculos específicos de campo.

Por exemplo, ao personalizar as cores do botão de envio, usar IDs de formulário específicos garante que as suas alterações afetam apenas os formulários pretendidos:

/* Customize submit button color for specific forms */
#wpforms-form-561 .wpforms-submit {
    background-color: red;
}

E é tudo o que precisa para encontrar e usar IDs de formulário e campo!

Próximo. gostaria de saber mais sobre como personalizar os seus formulários? Dê uma vista de olhos ao nosso guia sobre adicionar estilos CSS personalizados para os seus formulários.