Campo Texto

O Campo texto é aquele que você alcança a qualquer momento que um widget personalizado precisa de uma linha de texto que alguém pode editar: um título, um rótulo, uma legenda curta, uma palavra de botão Dentro dos complementos mestres Construtor de widgets, você solta um campo Texto no seu painel de widgets, dá-lhe um nome, e esse nome se torna um shortcode que você coloca em seu HTML, CSS ou JS. Quaisquer que sejam os tipos de usuário no Elementor, imprima diretamente em sua marcação.

Como todo campo Widget Builder, o campo Texto suporta Condições, para que possa mostrar ou ocultar o controlo com base no valor de outro campo A sua saída também passa pelo do construtor Mecanismo de modelo de sintaxe dupla, que permite que você embrulhe o token {% if %} verifica ou aplica filtros como |upper. Ambos os guias cobrem a configuração e as limitações.

Ele faz mais do que imprimir uma string simples, no entanto O campo Texto se conecta aos controles responsivos e tags dinâmicas do Elementor, para que um campo possa manter um título diferente no celular do que no desktop, ou extrair seu valor de uma fonte dinâmica como o título do post.

O que o campo Texto faz #

Um campo Texto renderiza uma entrada de texto de linha única no painel de opções do widget Quando alguém edita seu widget personalizado no Elementor, ele vê essa entrada, digita um valor e seu widget o emite onde quer que você tenha colocado o shortcode correspondente.

Ele combina bem com os outros campos de entrada no construtor Para conteúdo de várias linhas mais longo, alcance o Campo Área de Texto. Para conteúdo formatado rico, use o Campo WYSIWYG. O campo Texto é a escolha certa para strings curtas e simples Se você é novo na construção de widgets, leia o Visão geral do Widget Builder primeiro.

Antes de começar #

• WordPress com Elementor instalado e ativo.
• Complementos Mestres para Elementor instalado e ativo. Novo no plugin? veja o guia instalação.
• Um widget personalizado aberto no editor Widget Builder.

Como adicionar um campo de Texto #

No editor Widget Builder, encontre o painel de campos à esquerda e arraste o Texto campo em uma seção abaixo do Conteúdo, Estilo, ou Avançado aba. A maioria das entradas de texto pertence ao Conteúdo. Uma vez instalado, as opções do campo abrem à esquerda e seu shortcode aparece no Documentação barra lateral ao lado do editor de código.

Opções de campo de texto explicadas #

Selecione o campo Texto para abrir suas configurações Essas opções controlam a aparência e o comportamento da entrada no painel Elementor.

• Etiqueta: o texto que aparece acima do campo em Elementor Mantenha-o curto e claro, como “Heading” ou “Button Text”.
• Nome: o identificador exclusivo para o campo Deve conter apenas letras, números e sublinhados, portanto, sem espaços ou traços Este nome se torna seu shortcode, então um campo nomeado heading dá-lhe {{heading}}.
• Descrição: texto auxiliar opcional mostrado abaixo do campo Use-o para explicar o que a entrada controla.
• Espaço reservado: a dica acinzentada mostrada quando o campo está vazio, por exemplo “Escreva seu headline” Ele orienta o usuário sem definir um valor real.
• Valor padrão: o valor com o qual o campo começa Defina algo como “Build Better Experiences” para que o widget pareça finalizado antes que alguém o edite.

Configurações comuns: responsivas, dinâmicas e muito mais #

Role para baixo para Configurações Comuns para os controles que decidem o quão flexível é o campo É aqui que você liga valores responsivos e tags dinâmicas.

• Mostrar rótulo: alterne se o rótulo aparece acima do campo.
• Bloco de etiquetas: exiba o rótulo em sua própria linha acima da entrada, em vez de ao lado dela.
• Controle responsivo: ligue isso para permitir que os usuários definam um valor diferente para desktop, tablet e celular Bom para manchetes que precisam ser mais curtas em telas pequenas.
• Suporte Dinâmico: ligue isso para ativar tags dinâmicas Elementor, para que o campo possa extrair seu valor de uma fonte como o título da postagem ou o nome do autor, em vez de texto estático.
• Frontend disponível: disponibilize o valor do controle para o JavaScript frontend Habilite-o quando o JS do seu widget precisar ler o valor.
• Separador: defina onde uma linha divisória aparece ao redor do controle (Nenhum, Antes, Depois, Padrão).
• Condições: mostrar ou ocultar este campo com base no valor de outro controle Clique Adicionar condição para definir a regra.

Conecte o campo ao seu código #

Cada campo Texto gera um shortcode a partir do seu Nome Adicionar um campo nomeado heading e o token {{heading}} aparece na barra lateral Documentação. Solte esse token em seu HTML onde quer que o texto pertença.

Para uma manchete de herói, a mudança é pequena:

• Substitua o texto estático dentro do seu <h1> com {{heading}}.
• Salve o widget. Agora o <h1> imprime qualquer valor que o usuário defina no Elementor.

Como o shortcode é apenas um token, você também pode reutilizar o mesmo valor de campo em CSS ou JS. Um campo, muitos lugares.

Use o controle Texto no Elementor #

Arraste seu widget personalizado para uma página e abra-o no editor Elementor O campo Texto aparece como um controle normal com seu rótulo, espaço reservado e valor padrão já no lugar Dois pequenos ícones ficam ao lado da entrada: a ícone dispositivo para valores responsivos e a ícone de tags dinâmicas quando você ativou essas opções.

Digite um novo valor e as atualizações do widget ao vivo No exemplo abaixo, alterar o campo de cabeçalho reescreve o título do herói na página O mesmo tipo de campo funciona tão bem para um parágrafo, um rótulo de botão ou qualquer outra string curta Esse é o ponto inteiro do campo Texto: em qualquer lugar que um widget precise imprimir texto, esse é o controle que você usa.

Puxe o texto de uma tag dinâmica #

Com o Suporte Dinâmico ativado, clique no ícone de tags dinâmicas e escolha uma fonte Master Addons e Elementor listam tags agrupadas, como Título do Arquivo, Nome do Autor, Informações do Autor e Número de Comentários Selecione um e o campo extrai dados ao vivo em vez de texto estático, o que evita que você edite o mesmo título em dezenas de postagens.

Defina um valor diferente por dispositivo #

Com o Controle Responsivo ligado, clique no ícone do dispositivo para alternar entre Desktop, Tablet e Mobile e, em seguida, insira um valor separado para cada um Um título longo da área de trabalho pode se tornar mais curto nos telefones sem tocar na versão da área de trabalho. Vale a pena saber: se você deixar o tablet ou o valor do celular vazio, ele volta ao texto da área de trabalho, para que você substitua apenas os pontos de interrupção que realmente precisam dele.

Casos de uso comum #

• Manchetes de heróis que os editores podem alterar sem abrir o código.
• Seção parágrafos e descrições curtas.
• Etiquetas de botão e CTA amarrado ao link do widget.
• Crachás, etiquetas e pequenas legendas onde a formatação não é necessária.
• Títulos dinâmicos que puxam do post ou arquivo para modelos reutilizáveis.

Dicas para trabalhar com o campo Texto #

• Nomeie os campos de forma significativa. O Nome se torna seu shortcode, então heading lê melhor em código do que field_1.
• Sempre defina um valor padrão. Ele mantém o widget com aparência completa no editor e na primeira gota.
• Ligue apenas Responsivo e Dinâmico quando precisar deles. Controles extras atrapalham o painel para obter texto simples.
• Use o espaço reservado como orientação, não como conteúdo. Ele nunca é impresso na página, portanto, não confie nela para obter texto real.
• Construa o campo antes de referenciar seu shortcode. O token só existe quando o campo estiver no painel.

Perguntas frequentes #

Embrulhando #

O campo Texto do construtor de widgets é a maneira mais simples de tornar um widget Elementor personalizado editável Nomeie-o, solte seu shortcode em seu código, defina um padrão e ligue o suporte responsivo ou dinâmico quando um projeto solicitar. Depois disso, qualquer pessoa pode atualizar o texto do Elementor sem tocar em uma linha de código. Dê uma olhada no resto do Widgets e extensões Master Addons, e verifique o página preços para o que cada plano inclui.