Principais conclusões
- Elementor tem dois widgets de guia O original levou um aviso de depreciação desde a versão 3.8, e o widget Nested Tabs o substituiu.
- As guias aninhadas colocam um contêiner em cada painel, para que um formulário, uma galeria ou uma tabela de preços possam ficar dentro de uma guia.
- As guias aninhadas também mudam para um layout de acordeão vertical abaixo de um ponto de interrupção escolhido, que é o comportamento que a maioria das pessoas deseja nos telefones.
- Um widget de complemento como o Widget de guias de complementos mestres é a rota em que a faixa de guias em si é o problema de design: títulos de imagens, predefinições de estilo ou ativação do hover.
- Escolha pelo que vai dentro do painel Widgets dentro significa núcleo Uma faixa de guia estilizada sobre texto significa um complemento.
As guias fazem um trabalho: mantenha uma página longa curta Especificação, entrega e garantia não precisam estar todas na tela de uma só vez, e um visitante que queira uma delas não deve rolar além das outras duas.
Elementor dá-lhe dois widgets para isso e addons dar-lhe mais, e é por isso que a pesquisa painel para “tabs” é confuso Este guia abrange todas as três rotas, o que cada um pode segurar, e como eles se comportam em um telefone.
Índice
Qual widget de guias você realmente tem
Abra o painel de widgets e procure por guias Em uma instalação atual do Elementor você obtém o widget Tabs, e o que você arrasta é a versão aninhada O widget antigo ainda está no código para páginas que já o usam, e mostra um aviso no painel quando você edita um: qualquer novo widget de guias que você arrastar será o novo com recursos aninhados Esse aviso está lá desde o Elementor 3.8.
Então, na prática, há três coisas que você pode estar usando, e elas não são as mesmas.
| widget | O que acontece em um painel | De onde vem |
|---|---|---|
| Guias (aninhadas) | Um contêiner, portanto, quaisquer widgets | Elementor, grátis |
| Tabulações (antigas) | Somente conteúdo do editor | Elementor, obsoleto desde 3.8 |
| Widget de guias de complemento | Conteúdo do editor ou um modelo salvo com Pro | Addons Mestres e outros |
Rota 1: o widget Tabs aninhados
Este é o ponto de partida padrão e o direito Arraste as guias para a página e você receberá três guias, cada uma contendo um contêiner vazio.
- Arraste o widget Tabs para a página.
- Renomeie cada item no repetidor Tabs O título é tudo o que o repetidor detém, porque o conteúdo vive no contêiner.
- Clique em uma guia na tela e, em seguida, construa dentro de seu contêiner como faria em qualquer outro lugar.
- No Layout, use a Direção para mover a tira: Superior, Inferior, Iniciar ou Terminar, onde Iniciar e Terminar colocam os títulos em uma coluna lateral.
- Em Configurações Adicionais, defina Rolo Horizontal se os títulos não caberem e defina o Ponto de Interrupção onde a tira deve se tornar um acordeão.
O contêiner é o ponto inteiro Um formulário de contato, uma galeria, uma tabela de preços ou uma grade de loop funcionam dentro de uma guia, e nada mais nesta lista pode fazer isso. A negociação é que a faixa de guias em si seja bastante simples: títulos com um ícone opcional e nenhuma predefinição para começar.
Rota 2: um widget de guias de complemento
Widgets de addon existem para a outra metade do problema, onde a tira é o design O widget Master Addons constrói cada guia a partir de uma linha repetidora que carrega seus próprios campos.
A construção é:
- Arraste o widget e escolha uma predefinição de estilo.
- Adicione um item repetidor por guia, com um título de guia.
- Defina Tipo de Ícone como Nenhum, Ícone ou Imagem e, em seguida, escolha o ícone ou carregue a imagem.
- Escreva o conteúdo do painel no editor ou no tipo de conteúdo Pro point em uma seção salva, widget ou modelo de página.
- Defina o efeito de guia para clicar ou passar o mouse e alterne Definir como padrão na guia que deve ser aberta primeiro.
O que você abre mão é do contêiner Os painéis levam o conteúdo do editor, portanto, um formulário dentro de uma guia significa a rota Pro com um modelo salvo ou o widget principal.
Rota 3: o antigo widget Tabs
Se você estiver editando uma página construída há alguns anos, você pode estar olhando para o widget original: um repetidor de Itens de guias com um título e um campo de conteúdo, além de um controle de posição para horizontal ou vertical Ele ainda funciona, e Elementor ainda envia para que as páginas antigas não quebrem.
Não há razão para começar uma nova página com ele Se você já está lá, a questão é se reconstruir o bloco como Tabs aninhados vale os poucos minutos, e geralmente é, porque você obtém o ponto de interrupção do acordeão e o recipiente.
Qual rota se encaixa no trabalho
| O que você precisa | Usar |
|---|---|
| Um formulário, galeria ou tabela de preços dentro de uma guia | Guias aninhadas |
| Tabs que se tornam um acordeão nos telefones | Guias aninhadas |
| Uma imagem em cada título de tabulação | Widget de adição |
| Uma tira projetada sem estilo do zero | Widget de adição, por meio das predefinições |
| Painéis de comutação no hover | Widget de adição |
| O mesmo modelo salvo reutilizado em vários blocos de tabulação | Widget de complemento no Pro |
| Editando uma página construída antes do Elementor 3.8 | O widget antigo, ou reconstruí-lo |
Cinco coisas que valem a pena acertar
- Mantenha os títulos em uma ou duas palavras Os títulos longos envolvem e uma tira embrulhada para de ser lida como uma tira.
- Quatro guias são um máximo confortável na área de trabalho e três são melhores quando os títulos carregam ícones.
- Decida o que abre primeiro O widget principal sempre abre a guia um, então coloque o painel que a maioria das pessoas deseja lá.
- Qualquer coisa que um visitante deva ler pertence à página e não a um clique na guia quatro.
- Verifique a visualização do telefone antes de publicar, porque as duas rotas se comportam de maneira diferente ali.
Perguntas frequentes
Elementor tem um widget de guias na versão gratuita?
Sim. o widget Tabs está no plugin gratuito, e a versão atual é a aninhada, que coloca um contêiner dentro de cada painel.
O que aconteceu com o antigo widget Tabs?
Está obsoleto Desde o Elementor 3.8 o painel mostra um aviso quando você edita um, e qualquer novo widget de guias que você arrastar é a versão aninhada.
Posso colocar um formulário ou uma galeria dentro de uma aba?
Com as Tabulações Aninhadas, sim, porque cada painel é um contêiner Com um widget de addon o painel leva o conteúdo do editor, então o equivalente é um modelo salvo no Pro.
Um título de guia pode usar uma imagem em vez de texto?
Não no widget principal Os widgets de complemento com um controle de Tipo de Ícone podem usar um ícone ou uma imagem no título.
Quantas abas são demais?
Passado quatro ou cinco, a tira envolve em laptops e fica ilegível em telefones Nesse ponto, um acordeão é geralmente o melhor layout.
Pensamentos finais
O que fica dentro do painel decide isso Widgets em um painel significa Tabs Aninhados, toda vez Uma tira que tem que parecer algo específico, com títulos de imagem ou comutação de pairar, significa um addon Ambos são uma construção de dez minutos, uma vez que você sabe em qual você está.
Leitura relacionada
