Às vezes, uma seção precisa mostrar duas coisas no mesmo local, como perguntas frequentes e uma grade de equipe, ou preços mensais e anuais. O Alternar widget Conteúdo em Complementos Mestres para Elementor é um widget Pro que adiciona um pequeno switch que alterna entre eles. Cada opção de alternância contém texto simples ou um modelo de Elementor totalmente salvo, e os visitantes tocam em um rótulo para trocar o que mostra.
Você define os rótulos, ícones opcionais e o que cada um exibe, em seguida, estilo o interruptor para combinar É uma maneira limpa de caber mais em menos espaço sem enviar pessoas para outra página Este guia cobre todas as configurações no widget.
Prefere assistir primeiro? este pequeno tutorial percorre o widget Alternar conteúdo de ponta a ponta:
O que o widget Alternar conteúdo faz #
O widget mostra um interruptor de alternância com dois ou mais rótulos Clique em um rótulo e a área abaixo troca para o conteúdo dessa opção Cada opção pode ser um bloco de texto que você digita ou uma seção salva, página ou modelo de widget da sua biblioteca.
Como ele pode puxar modelos, a alternância não se limita a texto curto Você pode alternar entre um layout de FAQ inteiro e uma seção de equipe, ambos construídos em outro lugar no Elementor e soltos na alternância.
Antes de começar #
- WordPress com Elementor instalado e ativo.
- Master Addons Pro instalado com uma licença ativa, uma vez que o Toggle Content é um widget Pro. Novo no plugin? veja o guia instalação.
- Se você planeja alternar modelos, salve-os primeiro no Elementor biblioteca modelo.
Como adicionar o widget Alternar conteúdo #
No editor Elementor, abra o Elementos painel e pesquisa Alternar conteúdo, ou role para a seção Complementos mestres Arraste-o para sua página Ele carrega com duas opções de alternância de amostra para que você possa ver o interruptor imediatamente.
Configure as opções de alternância #
No Conteúdo guia, o Alternar conteúdo seção detém um Elementos repetidor. Cada item é uma opção de alternância Os padrões são Label One e Label Two, e você adiciona mais com Adicionar Item, duplicar com o ícone de cópia, ou remover com o X.
Clique em um item para abrir suas configurações, que possuem suas próprias sub-guias Conteúdo e Estilo.
- Etiqueta: o texto no botão de alternância, como FAQ ou Nossa Equipe Ele suporta tags dinâmicas.
- Ícone: um ícone opcional, com Posição do Ícone (Antes ou Depois da etiqueta) e Espaçamento entre Ícones.
- Tipo: escolha Conteúdo para texto digitado ou modelo para extrair um layout salvo.
- Conteúdo: quando Tipo é Conteúdo, um editor de texto completo aparece com mídia, formatação e visualização de código.
Alterne um modelo salvo em vez de texto #
Definir Tipo para Modelo e aparecem mais dois controles: Tipo de modelo (Seção, Página ou Widget) e Escolha seção, onde você escolhe qualquer modelo salvo da sua biblioteca. Isso permite que uma única opção de alternância exiba todo um layout pré-construído.
Na demonstração, uma opção aponta para uma seção de perguntas frequentes salva e a outra para uma seção de equipe. Vire a alternância e todo o layout é trocado.
Alternar configurações #
O Alternar configurações seção controla como o interruptor se comporta.
- Índice Ativo: qual opção mostra primeiro quando a página carrega Defina-a como 1 para a primeira opção, 2 para a segunda e assim por diante.
- Posição: mostrar o interruptor Antes (acima) ou Depois (abaixo) do conteúdo.
- Velocidade do indicador: quanto tempo demora o indicador ativo a deslizar entre as opções, em segundos (0,3 por omissão).
Estilize a alternância #
O Estilo a guia é dividida em Alternador, Indicador, e Etiquetas. A seção Toggler controla o próprio contêiner do interruptor.
- Estilo: a forma da alternância, como Round.
- Cor de fundo e raio de borda: o olhar da faixa do interruptor.
- Alinhar, ampliar e largura: posicione e dimensione o interruptor dentro de sua coluna.
- Fronteira, Sombra de Caixa, Preenchimento, Margem: os controles de enquadramento usuais.
O Indicador a seção estiliza o destaque deslizante atrás da etiqueta ativa e o Etiquetas conjuntos de seções Stack On para estados móvel, alinhamento, tipografia, espaçamento e cores para os estados Padrão, Hover e Ativo. Um separado Conteúdo a seção estiliza o painel abaixo do interruptor.
O resultado na página #
Publicar ou visualizar e a alternância funcionar ao vivo: os visitantes tocam em um rótulo, o indicador desliza para ele e o conteúdo abaixo troca Aqui a alternância muda do layout de perguntas frequentes para o modelo Nossa equipe, cada um com uma seção salva completa.
Casos de uso comum #
- Preços mensais versus anuais alternado acima de a tabela preços.
- FAQ e equipe seções que compartilham um slot em uma página de serviço.
- Descrição e especificações numa página de produto.
- Antes e depois layouts de estudo de caso.
- Dois modelos salvos trocado sem segunda página ou pop-up.
Dicas para trabalhar com o widget Alternar conteúdo #
- Construa modelos primeiro. Salve as seções que deseja alternar em sua biblioteca e aponte cada opção em uma.
- Mantenha os rótulos curtos. Uma ou duas palavras cabem no interruptor de forma limpa e lêem rápido.
- Defina o Índice Ativo deliberadamente. Liderar com a opção que a maioria dos visitantes deseja ver primeiro.
- Combine as alturas do conteúdo onde puder. Alternar entre alturas muito diferentes faz a página pular.
- Use ícones para maior clareza. Um pequeno ícone ao lado de cada rótulo ajuda as pessoas a diferenciar as opções.
Perguntas frequentes #
O que é o widget Alternar conteúdo em Master Addons?
É um widget Master Addons Pro para Elementor que adiciona um interruptor de alternância para alternar entre dois ou mais conjuntos de conteúdo no mesmo local Cada opção de alternância pode conter texto digitado ou um modelo Elementor salvo, e os visitantes tocam em um rótulo para trocar o que mostra.
A alternância pode mostrar um modelo Elementor salvo?
Sim. Em uma opção de alternância, defina Tipo para Modelo, escolha o Tipo de Modelo e escolha uma seção ou página salva em sua biblioteca. A alternância exibe todo o layout, para que você possa alternar entre designs completos pré-construídos.
Como defino qual opção aparece primeiro?
Abra a seção Alternar configurações e defina o índice ativo Use 1 para a primeira opção, 2 para a segunda e assim por diante Essa opção é mostrada quando a página é carregada e os visitantes podem mudar para as outras tocando em seus rótulos.
Posso adicionar ícones aos rótulos de alternância?
Sim. Cada opção de alternância tem um campo Ícone em sua sub-guia Conteúdo. Defina a posição do ícone no mesmo item para colocá-lo antes ou depois do texto do rótulo.
Como o Conteúdo do Toggle é diferente das Tabs?
Ambos alternam o conteúdo no lugar, mas o alternador é um único switch compacto construído para duas ou algumas opções, muitas vezes uma escolha binária como mensal e anual As guias se adequam a listas mais longas de seções Para perguntas frequentes dobráveis, um acordeão é o melhor ajuste.
Embrulhando #
O widget Alternar conteúdo encaixa dois layouts em um slot e permite que os visitantes alternem entre eles com um toque Adicione suas opções, escolha o texto ou um modelo salvo para cada um, defina qual deles lidera e estilize o switch para combinar Para uma visão geral e uma comparação com acordeões e guias, consulte o Elementor conteúdo alternar widget página. Para outras formas de organizar o conteúdo, consulte o Widget de guias avançadas e o Widget Acordeão Avançado, navegue por completo Widgets e extensões Master Addons, e verifique o página preços para o que cada plano inclui.
