Principais conclusões
- Um botão de alternância Elementor pode significar três coisas: um título que abre e fecha texto, um link Leia mais que expande um parágrafo ou um switch que troca uma seção por outra.
- O Elementor 4.3 oculta o widget Toggle antigo do painel de widgets, e o widget Accordion agora o cobre através da configuração Max Items Expanded, que tem duas opções: Uma e Múltipla.
- Um alternador Leia mais no Elementor é um widget Accordion com um único item, com o estado padrão definido como Todos desmoronado para que o texto extra permaneça fechado até que um visitante clique.
- Elementor e Elementor Pro não possuem widget que alterna entre dois blocos de conteúdo, portanto, um botão de alternância de estilo mensal e anual precisa de um widget de complemento ou guias aninhadas.
- O widget Master Addons Toggle Content é um widget Pro que coloca um botão de alternância acima de duas ou mais opções e cada opção contém texto ou um modelo Elementor salvo.
Você pode criar um botão de alternância Elementor de três maneiras, e o direito depende do que o botão deve fazer Para abrir e fechar o texto, use o widget Accordion Para expandir um parágrafo longo, use um acordeão de um item como alternância Read More Para trocar um bloco de conteúdo por outro, como preços mensais para os anuais, use a widget de alternância de conteúdo.
Este guia percorre todos os três com as configurações exatas Cada captura de tela vem do Elementor 4.3 em um local de teste, para que os painéis correspondam ao que você verá hoje.
Índice
O que significa um botão de alternância no Elementor
Um botão de alternância é qualquer controle que flips entre dois estados quando você clica nele Em Elementor, as pessoas usam a frase para três trabalhos diferentes, e cada trabalho tem seu próprio widget.
| O que você quer | Como é chamado | Widget a usar |
|---|---|---|
| Clique em um título, o texto abaixo dele abre Clique novamente, ele fecha. | Alternar ou acordeão | Acordeão Elementor |
| Mostre uma introdução curta e esconda o resto atrás de um link Leia mais | Leia mais alternar | Elementor Acordeão com um item |
| Vire um interruptor e uma seção será substituída por outra | Alternar conteúdo ou alternador de conteúdo | Complementos mestres alternam conteúdo ou guias aninhadas |
Se você pesquisar no painel de widgets por “toggle” no Elementor 4.3, você não encontrará um widget chamado Toggle. Elementor mostra Tabs and Accordion para essa pesquisa, além de Alternar conteúdo se você tiver Master Addons Pro.
Caminho 1: Uma alternância que abre e fecha o texto
Use o widget Accordion quando o botão de alternância deve abrir e fechar um bloco de texto, como em uma FAQ O widget Toggle antigo permite que vários itens permaneçam abertos ao mesmo tempo, e o widget Accordion agora faz a mesma coisa por meio de uma configuração.
- Edite sua página com Elementor, procure no painel de widgets Acordeão e arraste-o para a página.
- Clique em cada item e digite seu título Em seguida, clique dentro do item e adicione um widget Editor de texto, ou qualquer outro widget, para o conteúdo.
- Abrir o Interações seção na guia Conteúdo.
- Definir Itens máximos expandidos para Múltiplo. Cada item agora abre e fecha sozinho, que é o comportamento clássico de alternância.
- Definir Estado padrão para Todos desabaram se cada item começar fechado ou deixá-lo ligado Primeiro expandido.
Com o Max Items Expanded on One, abrir um item fecha o anterior Com o Multiple, os visitantes podem manter duas ou três respostas abertas e compará-las.
A seção Layout do widget possui um Esquema de perguntas frequentes alternar. Ligue-o quando os itens forem perguntas e respostas reais Para mais estilos de título e ícones, o Widget Acordeão Avançado de Master Addons é uma alternativa.
Caminho 2: Uma alternância Leia mais
Um botão de alternância Leia mais é um acordeão com um item O visitante vê as linhas de abertura, clica em Leia mais e o resto do texto aparece abaixo.
- Adicione um widget Editor de Texto com a parte do texto que deve sempre mostrar.
- Arrastar um Acordeão widget bem abaixo dele.
- Exclua os itens extras para que reste apenas um e renomeie-o Leia mais.
- Coloque o texto restante dentro desse item.
- Em Interações, definir Estado padrão para Todos desabaram.
- Na guia Estilo, remova a borda e o preenchimento se desejar que o link fique nivelado com o parágrafo acima.
Elementor também tem um widget chamado Read More, e ele faz um trabalho diferente Ele marca onde o trecho de um post termina em páginas de arquivo, o mesmo que a tag WordPress More Ele não expande ou colapsa nada, como Documentação do Elementor explica.
Caminho 3: Um interruptor de alternância que troca conteúdo
Use um botão de alternância de conteúdo ao clicar no botão deve substituir um bloco por outro Nem o Elementor nem o Elementor Pro têm um widget para isso, então você precisa de um complemento ou uma solução alternativa com as guias.
As etapas abaixo usam Alternar conteúdo do Master Addons Pro.
- Edite sua página com Elementor, procure por Alternar conteúdo e arraste-o para o lugar Começa com dois itens, Etiqueta Um e Etiqueta Dois.
- No Elementos listar, clique no primeiro item e digite o seu Etiqueta, por exemplo Para equipes.
- Deixar Tipo no Conteúdo e escreva o texto para essa opção no editor Para mostrar um layout completo, defina Tipo como Modelo e escolha um modelo salvo.
- Faça o mesmo para o segundo item Clique Adicionar Item se precisar de uma terceira opção.
- Aberto Alternar configurações. Índice Ativo decide qual opção aparece primeiro e Posição coloca o interruptor antes ou depois do conteúdo.
- Na guia Estilo, escolha Redondo ou Quadrado para o interruptor e defina as cores do indicador e da etiqueta.
O uso mais comum é um switch de cobrança Cada opção contém um conjunto de cartões de preços, e o botão de alternância se move entre eles.
Quer vê-lo a funcionar? O Alternar página do widget Conteúdo tem dez demonstrações ao vivo nas quais você pode clicar, desde switches de faturamento até tabelas de especificações.
Se você não quiser um addon, solte um widget Tabs na página e nomeie as duas guias Mensal e Anual As guias no Elementor 4.3 aceitam qualquer widget dentro de cada guia Você obtém títulos de guias no lugar de um switch deslizante e o conteúdo é trocado da mesma maneira.
Qual botão de alternância você deve usar?
Escolha o widget pelo que acontece após o clique.
| Situação | Usar | Porquê |
|---|---|---|
| FAQ com muitas perguntas | Acordeão, itens máximos expandidos em um | A página permanece curta porque apenas uma resposta está aberta |
| Detalhes do produto que os visitantes comparam | Acordeão, itens máximos expandidos em vários | Vários painéis podem permanecer abertos juntos |
| Longo Sobre texto | Acordeão de um item como Leia mais | A introdução mostra e o resto espera por um clique |
| Preços mensais e anuais | Alternar conteúdo | Um conjunto substitui o outro no mesmo espaço |
| Dois públicos, uma seção | Alternar conteúdo | Cada visitante escolhe a versão escrita para eles |
| Quatro ou mais seções de igual peso | Guias | Os títulos das guias são mais fáceis de digitalizar do que um switch longo |
Problemas comuns com botões de alternância
Três problemas surgem com mais frequência com alternâncias no Elementor.
- Falta o widget Alternar Elementor esconde-o do painel nas versões atuais Usar Acordeão com Itens Max Expandido definido como Múltiplo.
- A alternância abre no carregamento da página No widget Accordion, defina o Estado Padrão para Todos em colapso No Toggle Content, uma opção sempre mostra e o Active Index decide qual.
- Clicar no switch não faz nada Verifique se cada opção tem conteúdo Uma opção definida como Template sem modelo escolhido mostra uma área vazia.
Se você precisar que o conteúdo apareça apenas para alguns visitantes, como usuários logados, uma alternância é a ferramenta errada Isso é um trabalho para condições de exibição no Elementor, que decidem quais cargas antes que o visitante clique em qualquer coisa.
Perguntas frequentes
Como adiciono um botão de alternância no Elementor?
Arraste o widget Accordion para a página para uma alternância que abre e fecha o texto e defina Itens Máximos Expandidos para Múltiplos na seção Interações Para um botão de alternância que alterna entre duas seções, adicione um widget de alternância de conteúdo, como Complementos Mestres Alternar Conteúdo e dê a cada opção seu próprio conteúdo.
Onde está o widget Alternar no Elementor?
Elementor 4.3 não mostra mais o widget Alternar no painel de widgets Procurando por “toggle” retorna Acordeão e Tabs O widget Acordeão cobre o mesmo trabalho: defina Itens Máx Expandidos para Múltiplos e vários itens podem ficar abertos, que é como o widget Alternar se comportou.
Qual é a diferença entre um alternador e um acordeão no Elementor?
Em um acordeão, abrir um item fecha os outros Em uma alternância, cada item abre e fecha sozinho, então vários podem ser abertos juntos Nas versões atuais do Elementor, ambos são o mesmo widget Accordion, e a configuração Itens Max Expanded alterna entre os dois comportamentos.
Posso fazer um Elementor alternar aberto por padrão?
Sim. no widget Accordion, defina Estado padrão como Primeiro expandido e o primeiro item abre quando a página é carregada No widget Alternar conteúdo, defina Índice ativo como o número da opção que deve ser mostrada primeiro, com 1 para o primeiro item.
O Elementor Pro possui um interruptor alternador para preços?
No. Elementor Pro tem um widget Tabela de preços, mas nenhum switch que troca tabelas mensais e anuais Você pode colocar as tabelas dentro Tabs, ou usar um widget de alternância de conteúdo de um addon e carregar cada conjunto de preços como uma opção.
Pensamentos finais
Um botão de alternância Elementor é uma das três coisas, e cada um tem uma casa clara Abrir e fechar texto com o widget Accordion e sua configuração Max Itens Expanded Construir um botão Read More alternar a partir de um acordeão de um item Alternar entre duas seções com um botão de alternância de conteúdo.
Para o terceiro tipo, o Alternar widget Conteúdo lida com texto e modelos salvos em cada opção, e o Planos Master Addons Pro liste o que mais vem com ele.
Leitura relacionada
