Exibindo Shortcodes Dentro dos Rótulos dos Campos do Formulário

Gostaria de aprimorar os rótulos dos seus formulários com dicas interativas ou conteúdo dinâmico usando códigos curtos? Embora o WPForms não suporte códigos curtos em rótulos por padrão, você pode facilmente adicionar essa funcionalidade usando PHP.

Este guia mostrará como exibir qualquer código curto dentro dos rótulos dos campos do seu formulário.

Instalar o Plugin Shortcodes Ultimate (opcional)

Se ainda não tem um plugin de códigos curtos, pode instalar o Shortcodes Ultimate do repositório de plugins do WordPress. Este passo é opcional se já tiver outro plugin de códigos curtos ou estiver a usar códigos curtos integrados do seu tema.

Para obter ajuda na instalação de plugins, pode consultar o guia da WPBeginner sobre como instalar um plugin.

Criar o Seu Formulário

Pode criar um novo formulário ou editar um existente. Para qualquer ajuda necessária sobre como criar um formulário, por favor, consulte esta documentação.

Não precisaremos do Rótulo para o campo do formulário Telefone, pois usaremos o texto da dica como nosso rótulo. Portanto, na aba Avançado do campo do formulário, selecione a opção Ocultar Rótulo e, em seguida, clique em Guardar no formulário.

Adicionar o Código

Para exibir códigos curtos nos rótulos dos seus formulários, terá de adicionar um trecho de código ao seu site. Se não tiver a certeza de como adicionar código personalizado, por favor, consulte o nosso guia sobre como adicionar trechos de código.

No trecho de código acima, terá de modificar três valores chave:

• Na linha 10: Substitua 1055 pelo ID do seu formulário
• Na linha 10: Substitua 4 pelo ID do seu campo
• Na linha 12: Substitua o código curto pelo código curto desejado

Quando os seus visitantes virem o formulário e clicarem na dica, verão a sua mensagem.

FAQ

P: Como adiciono códigos curtos diferentes para formulários e rótulos diferentes?

R: Se quiser reutilizar este trecho para outros formulários usando códigos curtos diferentes, certamente poderia fazê-lo.

/**
 * Run shortcodes on the form label field.
 *
 * @link   https://wpforms.com/developers/how-to-display-shortcodes-inside-the-label-of-the-form-field/
 */
 
function add_shortcode_to_label( $field, $form_data ) {
         
        // Check that the form ID is 1055 and the field id is 4 for the Phone field
    if ( 1055 === absint( $form_data[ 'id' ] ) && 4 === absint( $field[ 'id' ] ) ) {
 
        echo do_shortcode( ' [su_tooltip text="Your information is completely protected and will not be sold!<br><a href=&ldquo;https://myexamplesite.com/privacy/&ldquo;>Click here to learn more.</a>" behavior="click" hide_delay="500"]Click Me![/su_tooltip] ' );
     
        }
     
        // Check that the form ID is 1055 and the field id is 2 for the Name field
    if ( 1055 === absint( $form_data[ 'id' ] ) && 2 === absint( $field[ 'id' ] ) ) {
 
        echo do_shortcode( ' [su_tooltip text="I am a different tooltip for a different field on the same form." behavior="click" hide_delay="500"]Click Me Too![/su_tooltip] ' );
     
        }   
 
        // Check that the form ID is 1072 and the field id is 6 for the Comments field
    if ( 1072 === absint( $form_data[ 'id' ] ) && 6 === absint( $field[ 'id' ] ) ) {
 
        echo do_shortcode( ' [su_tooltip text="I am a different tooltip for a different field on a completely different form." behavior="click" hide_delay="500"]Click Me Too![/su_tooltip] ' );
     
        }
     
}
add_action( 'wpforms_display_field_before', 'add_shortcode_to_label', 16, 2 );

E é tudo o que precisa para exibir qualquer código curto dentro de um campo de formulário Rótulo. Gostaria de exibir códigos curtos dentro do campo HTML? Dê uma olhada no nosso artigo sobre Como Exibir Códigos Curtos Dentro do Campo HTML.

Ação de Referência

wpforms_display_field_before