Extensão da dica de ferramenta do elementor - adicione dicas de ferramentas a qualquer coisa
Tooltips é uma extensão Pro. Ele adiciona um painel Tooltip a cada widget, contêiner, coluna e seção Elementor Selecione algo que já está em sua página, escreva a mensagem, escolha um posicionamento e estilo-lo para combinar com seu site Se você quiser uma nova dica em um local vazio em vez disso, use o autônomo Widget de dica de ferramenta, que vem com o plugin gratuito.
O que você pode fazer com a extensão Tooltips
Posicionamento e comportamento interativo
Coloque a bolha na parte superior, inferior, esquerda ou direita de qualquer elemento Acionador ao passar o mouse ou clique. Adicione animação de entrada (desvanecer, dimensionar), duração e ocultar atraso. Ou habilite Seguir Cursor para que a dica viaje com o mouse, o que funciona bem para mapas, gráficos e diagramas.
- Pin tooltips para qualquer lado para que eles nunca cobrem o conteúdo que eles explicam.
- Seguir Cursor transforma imagens e diagramas em superfícies exploráveis e rotuladas.
- Os controles de animação e tempo fazem com que cada dica pareça nativa da interface.
Personalização visual
Substitua os padrões do navegador por dicas de ferramentas que você mesmo projeta: cores de texto e fundo, preenchimento, bordas, raio da borda, estilo e cor da seta, sombra da caixa e controle completo de tipografia.
- Cores exatas da marca para fundo, texto e seta.
- Fronteiras, raio e sombras que correspondem ao resto do seu sistema de design.
- Controles de família, tamanho e peso de fontes para microcópia legível.
Dicas de ferramentas em qualquer elemento, com conteúdo dinâmico
Funciona em botões, ícones, imagens, cabeçalhos, contêineres, colunas, seções e qualquer outra coisa que você possa selecionar no editor O campo de texto da dica de ferramenta aceita tags dinâmicas Elementor, para que uma dica possa extrair dados ao vivo, como um preço ou uma data de postagem.
- Ligue a extensão uma vez e cada elemento recebe um painel de Dica de Ferramenta Você nunca adiciona um widget separado para cada dica.
- Cada elemento mantém sua própria dica de ferramenta, então três cartas seguidas podem dizer algo diferente.
- As tags dinâmicas mantêm as dicas atualizadas, por exemplo, detalhes de produtos ao vivo.
Extensão ou Elemento: qual você precisa?
Esta página (Extensão das dicas de ferramentas, Pro): o conteúdo já existe e você deseja anexar uma dica a ele Ele funciona em qualquer widget, coluna, seção ou contêiner.
Elemento da ponta da ferramenta (grátis): você precisa de uma nova dica na página, e o widget fornece seu próprio texto de gatilho, ícone ou imagem.
Casos de uso comum
- Ícones e botões: explique o que um botão somente de ícone faz antes do clique.
- Imagens e diagramas: Siga as etiquetas do cursor em mapas, plantas baixas, desenhos técnicos.
- Títulos e termos: defina o jargão em linha sem notas de rodapé.
- Seções: Emblemas Beta ou “new” e dicas de convocação de recursos em blocos inteiros.
- WooCommerce: notas de envio, estoque ou variante anexadas ao botão de compra.
Como adicionar uma dica de ferramenta a qualquer widget Elementor
- Selecione qualquer coisa Clique em um widget, coluna, contêiner ou seção no Elementor e abra sua guia Avançado para encontrar a seção Dica de Ferramenta.
- Escrever e colocar. Insira a mensagem, depois defina o posicionamento, o gatilho (hover, clique ou personalizado), a animação, a duração e o Seguir Cursor se precisar.
- Estilo-lo Defina cores, tipografia, preenchimento, raio, seta e sombra, em seguida, atualizar a página.
- Para um passo a passo com capturas de tela, leia como adicionar uma dica de ferramenta no Elementor.
Perguntas frequentes para dicas de ferramentas
Como isso é diferente do widget Tooltip?
Ambos têm predefinições de posicionamento, acionadores de pairar ou clicar, animações e Seguir Cursor A diferença é onde a dica de ferramenta vive A extensão anexa uma ao conteúdo que já está em sua página e precisa Pro. O Elemento tooltip é um widget independente gratuito com seu próprio texto de gatilho, ícone ou imagem Botão, ícone ou seção existente: use a extensão Ponto vazio que precisa de uma dica: use o elemento.
Como as dicas de ferramentas se comportam no celular?
O hover não existe em telas sensíveis ao toque, então um toque atua como o gatilho e um segundo toque em outro lugar descarta a bolha Mantenha o texto da dica de ferramenta móvel curto e prefira o gatilho de clique para dicas críticas.
As dicas de ferramentas são boas para SEO e acessibilidade?
O texto da dica de ferramenta está no HTML, por isso é rastreável Mas nunca coloque informações essenciais apenas dentro de uma dica de ferramenta, uma vez que alguns fluxos de leitor de tela e teclado podem perdê-lo Use dicas de ferramentas para ajuda suplementar e teste com ferramentas de acessibilidade.
Muitas dicas de ferramentas irão desacelerar minha página?
Cada dica de ferramenta adiciona uma pequena quantidade de HTML e CSS O uso típico, em torno de 5 a 10 por página, não tem impacto perceptível Dezenas de dicas de ferramentas animadas pesadas em uma página podem somar, portanto, mantê-las concisas.
Para que serve o Follow Cursor?
Visuais exploráveis: mapas, hotspots de produtos, gráficos, diagramas técnicos A bolha segue o ponteiro para que cada área sob o cursor obtenha sua própria explicação ao vivo.
Posso usar conteúdo dinâmico dentro de uma dica de ferramenta?
Sim. Combine com tags dinâmicas para injetar dados ao vivo, como preços, nomes ou datas, para que as dicas permaneçam atualizadas sem edições manuais.
Widgets e extensões de elementos de tendência
Construa sites sofisticados em menos tempo.
Glassmorphismo
Contêiner Extras
Padrões
Duplicador de postagem/página
