Como criar uma tabela Elementor no WordPress

As tabelas são um componente chave na maioria dos sites. Você pode usá-los para compartilhar todos os tipos de informações, desde preços até listas de recursos e links. O WordPress permite que você configure tabelas básicas para o seu site, mas você pode estar procurando por mais opções de personalização.

Com o Elementor, você obtém acesso a vários widgets de tabela. Além disso, existem muitos plugins de tabela Elementor que adicionam novos widgets ao popular construtor de páginas.

Neste artigo, falaremos sobre como as tabelas do WordPress funcionam e como elas se comparam aos widgets Elementor. Em seguida, mostraremos como criar tabelas Elementor manualmente e apresentaremos alguns plugins que adicionam novos widgets de tabela ao editor. Vamos lá!

Quando usar tabelas do WordPress

Assim que começar a procurá-los, você notará que as tabelas estão em toda parte na web. Isso porque eles são alguns dos elementos mais versáteis que você pode usar em um site.

Veja as tabelas de preços, por exemplo. É difícil encontrar um serviço ou site de assinatura que não use tabelas para ajudá-lo a comparar as opções:

As tabelas permitem que você apresente grandes quantidades de informações de uma maneira fácil para os leitores digerirem. Melhor ainda, as tabelas tornam mais simples para os usuários comparar vários conjuntos de dados entre si:

Além de ajudar você a compartilhar informações, as tabelas também podem ajudar a quebrar a monotonia de parágrafos longos em uma postagem de blog ou página. Normalmente, recomendamos que você evite paredes longas de texto, pois podem ser difíceis de navegar.

O Block Editor oferece a opção de adicionar tabelas ao seu site com facilidade. O bloco Tabela permite definir o número de linhas e colunas que você precisa:

Embora adicionar tabelas no WordPress seja fácil, você está um pouco limitado quanto às opções de personalização. Você pode alterar as cores do plano de fundo, personalizar os estilos dos botões e modificar os tamanhos das fontes, mas é basicamente isso. Se você quiser criar tabelas mais elegantes e complexas, precisará usar um construtor de páginas como o Elementor (ou mesmo o Divi).

O que uma tabela Elementor pode fazer

Se você quiser ir além das tabelas básicas do WordPress, o Elementor oferece acesso a um widget Tabela de preços altamente personalizável. Isso permite que você edite títulos de tabela, defina tags de cabeçalho, adicione listas de recursos, ajuste Calls To Action (CTAs) e muito mais:

Lembre-se de que, com o Elementor, você pode criar qualquer tipo de layout que desejar para qualquer página ou postagem. Isso significa que você pode configurar designs de várias colunas para ter vários widgets da Tabela de Preços lado a lado:

O Elementor também vem com um widget de Índice . Isso torna a navegação de conteúdo de formato longo muito mais fácil para seus leitores.

Como criar uma tabela Elementor (manualmente)

Criar uma tabela de preços usando o Elementor é simples. Para começar, abra o editor Elementor. A partir daqui, você pode optar por começar com uma página em branco ou importar um modelo da biblioteca Elementor:

Quando estiver pronto para adicionar o elemento, você desejará selecionar o número de colunas que deseja que a tabela tenha. Clique no sinal de mais Elementor na parte inferior do editor e selecione a estrutura de colunas que deseja usar para a seção de preços:

Lembre-se de que, se você usar várias colunas, precisará adicionar um widget de Tabela de preços separado em cada uma delas. Embora cada tabela seja um elemento único, os usuários as verão lado a lado (ou abaixo uma da outra no celular) como parte de uma seção:

Recomendamos adicionar um módulo Tabela de preços e estilizá-lo primeiro. Em seguida, você pode duplicar ou copiar esse elemento nas colunas restantes e adicionar texto exclusivo a cada uma.

Para personalizar a tabela, selecione o elemento e vá para a guia Estilo nas configurações do widget. O Elementor oferece muitas opções de estilo. Isso inclui seleção de cores, configurações de tipografia e configurações exclusivas para cada seção da tabela:

Quando estiver satisfeito com o estilo da tabela de preços, clique com o botão direito do mouse no elemento e selecione a opção Duplicar . Uma cópia da tabela aparecerá sob o elemento original e você poderá arrastá-la para uma das colunas vazias:

Você desejará repetir esse processo para quantas colunas tiver. Tenha em mente que cada tabela pode ter um estilo único se você preferir não reutilizar as configurações. Nesse caso, certifique-se de que os estilos sejam semelhantes o suficiente para que os visitantes entendam que estão vendo uma comparação.

Ao personalizar sua tabela, lembre-se de que o Elementor permite adicionar CSS personalizado a qualquer módulo. Para isso, acesse as configurações avançadas do widget e selecione a guia CSS personalizado :

Adicionar CSS personalizado por meio do Elementor é muito mais fácil do que editar o código do WordPress manualmente. Da mesma forma, editar CSS no WordPress exige que você acesse arquivos de tema e otimize o código para obter o máximo desempenho. Com o Elementor, você só precisa adicionar o código CSS no campo correspondente para cada módulo.

Se adicionar CSS manualmente parece intimidante, não se preocupe. Aprender CSS não requer que você seja um desenvolvedor web. No entanto, é uma habilidade valiosa que o ajudará a personalizar seus sites WordPress (e talvez até encontrar uma carreira em desenvolvimento web).

Depois que todas as suas tabelas estiverem definidas, é hora de editar o texto e adicionar quantos recursos forem necessários para cada entrada. Você pode fazer isso selecionando uma tabela e movendo para a guia Conteúdo nas configurações do widget:

Editar o conteúdo de suas tabelas de preços é fácil. Você pode clicar em qualquer elemento dentro do widget para começar a editá-lo. Quando estiver satisfeito com os resultados, suas tabelas de preços estarão prontas.

Plug-ins de tabela do Elementor Top (12 opções)

Embora o Elementor contenha muitas ferramentas para ajudá-lo a criar tabelas, você sempre pode adicionar mais widgets à lista. Nesta seção, veremos 12 plugins Elementor que você pode usar para adicionar novos tipos de tabelas às suas postagens e páginas. Embora muitos desses complementos sejam criados para o Elementor, você pode instalá-los como plug-ins comuns.

Como sempre, recomendamos apenas os melhores plugins do WordPress que oferecem ótimo desempenho e que recebem atualizações regulares. O uso de plug-ins bem otimizados ajudará você a dimensionar seu site sem problemas de desempenho.

1. Complementos do ElementsKit para Elementor

O ElementsKit adiciona mais de 85 widgets ao Elementor. Você tem opções para tabelas básicas, tabelas de preços, suporte para incorporar elementos do TablePress e muito mais.

A versão Professional do ElementsKit também inclui um widget de tabelas avançado. Isso permite adicionar recursos de pesquisa e filtro às tabelas. Além disso, você pode incluir paginação para que os usuários possam navegar pelas entradas sem ter tabelas enormes em seu site.

Características principais:

• Três tipos de widgets de tabela
• Suporte para filtragem de tabela, pesquisa e paginação
• Integração com TablePress para incorporar tabelas

Preço: as licenças do ElementsKit começam em $ 39 por ano.

2. Construtor de Tabelas WP

Se você é fã de editores de arrastar e soltar (o que deveria ser se estiver usando o Elementor), vai gostar de usar o WP Table Builder. Este plug-in permite que você crie tabelas usando elementos pré-configurados, como botões, seções de revisão, classificações de produtos e muito mais.

Além dos elementos avançados, você tem acesso a módulos básicos, como texto e imagens. O plug-in também vem com modelos de tabela, o que tornará seu trabalho ainda mais simples.

Você pode adicionar tabelas do WP Table Builder ao seu site usando o Block Editor. O plug-in também se integra ao Elementor, facilitando a colocação de tabelas em qualquer lugar do seu site.

Características principais:

• Use um construtor de tabelas de arrastar e soltar
• Obtenha acesso a elementos pré-criados, como botões, seções de revisão e classificações de produtos
• Personalize o estilo de cada elemento em suas tabelas
• Use modelos de página pré-criados

Preço: as licenças do WP Table Builder começam em US$ 39 por ano.

3. TablePress

O TablePress é um plug-in gratuito que é o mais próximo possível de adicionar funcionalidade de planilha ao WordPress. O plug-in pode importar dados em vários formatos, incluindo arquivos Excel, CSV e JSON. Você pode até exportar dados de tabela para outros programas.

Com o TablePress, você pode criar tabelas que incluem a funcionalidade de pesquisa. Os usuários podem escolher quantas entradas exibir e mover de uma página para outra se você estiver mostrando grandes conjuntos de dados.

A incorporação de tabelas do TablePress com o Elementor é simples. O plugin cria códigos de acesso exclusivos para cada tabela. O widget Elementor Shortcode ajudará você a adicionar esses códigos em qualquer lugar do seu site.

Características principais:

• Importe e exporte conjuntos de dados nos formatos Excel, CSV, JSON e HTML
• Adicione tabelas pesquisáveis ​​ao WordPress
• Ativar paginação para tabelas

Preço: TablePress é um plugin gratuito, mas você pode encontrar extensões premium para ele.

4. Complementos essenciais para Elementor

Essential Addons for Elementor adiciona mais de 80 novos widgets ao construtor de páginas. Você tem opções para tabelas de preços, tabelas de dados, sumários e muito mais.

Os complementos essenciais para Elementor vêm em duas versões. O plug-in gratuito adiciona uma versão melhor do widget da tabela de preços que o Elementor acompanha. Se você quiser acessar as tabelas de dados (que incluem filtragem, pesquisa e vários estilos), precisará pagar por uma licença premium.

Características principais:

• Adicionar widgets de tabela de preços, dados e conteúdo
• Ativar pesquisa e filtragem em tabelas

Preço: Há uma versão gratuita do Essential Addons for Elementor e as licenças premium começam em $ 39,97 por ano.

5. PowerPack para Elementor

O PowerPack for Elementor adiciona mais de 70 widgets ao construtor de páginas. O plug-in também inclui um grande número de novos modelos que você pode usar para criar sites mais rapidamente.

No que diz respeito às tabelas, o PowerPack permite que você configure tabelas de dados classificáveis ​​e pesquisáveis. Você pode importar dados para tabelas usando arquivos CSV. O plug-in também inclui várias opções de modelo de tabela.

Além das tabelas de dados, o PowerPack oferece widgets de informações e tabelas de preços. As tabelas de informações são perfeitas se você deseja fornecer aos visitantes um detalhamento dos serviços que você oferece.

Características principais:

• Crie tabelas de dados classificáveis ​​e pesquisáveis
• Importar tabelas de dados no formato CSV
• Adicionar widgets de tabela de informações e preços

Preço: as licenças do PowerPack começam em US$ 44 por ano.

6. Complementos exclusivos para Elementor

Complementos exclusivos para Elementor vêm em versões gratuitas e premium. O plug-in gratuito adiciona 39 novos widgets ao Elementor, enquanto uma licença premium oferece mais de 69 novos elementos.

Quando se trata de tabelas, a versão gratuita adiciona um novo módulo de tabela de preços ao mix. Com a versão premium, você tem acesso a tabelas de comparação e dados. As tabelas de comparação funcionam de maneira semelhante aos elementos de preços, mas você pode usar novos layouts e estilos.

Características principais:

• Adicionar um novo módulo de tabela de preços
• Obtenha acesso a tabelas de comparação e dados
• Acesse vários layouts para widgets de tabela

Preço: Existe uma versão gratuita de Complementos Exclusivos para Elementor. As licenças premium começam em $ 29 por ano.

7. JetElements

JetElements adiciona 45 novos widgets ao Elementor. A maioria deles é voltada para sites de comércio eletrônico e assinatura. No entanto, JetElements também inclui vários widgets de tabela interessantes em sua lista.

Entre esses widgets, você tem tabelas de preços e responsivas. Em comparação com as tabelas de preços base no Elementor, a versão JetElements oferece muitas novas opções de personalização. Por exemplo, você pode brincar com muitos efeitos visuais, como paralaxe e micro animações para elementos de mesa.

Características principais:

• Adicione preços e tabelas responsivas ao Elementor
• Personalize tabelas usando novos efeitos visuais, como paralaxe

Preço: as licenças com tudo incluído da JetElements começam em US$ 130 por ano. Você também pode criar pacotes de widgets personalizados, escolhendo apenas as opções que deseja usar.

8. Complementos Premium para Elementor

Os complementos premium para Elementor vêm em versões gratuitas e premium. No entanto, apenas o plugin premium adiciona novos widgets de tabela ao Elementor.

Se você pagar por uma licença premium, terá acesso a novos dados e widgets de tabela de preços. Você pode acompanhar as tabelas de dados com gráficos e widgets de gráfico se desejar exibir mais informações para seus visitantes.

Características principais:

• Adicionar widgets de tabela de dados e preços ao Elementor
• Acompanhe as tabelas com widgets de gráfico e gráfico

Preço: As licenças para Premium Addons para Elementor começam em $ 39 por ano.

9. Mentor de Dados

DataMentor é um plugin que adiciona um widget de tabela única ao Elementor. No entanto, esse widget contém muito mais recursos do que a maioria dos complementos que vimos até agora.

As tabelas DataMentor são incrivelmente versáteis. Você pode adicionar imagens, botões, listas e ícones em cada elemento. O widget permite criar tabelas com estilos individuais para cada coluna ou linha. Você também terá acesso a vários modelos de tabela se quiser iniciar o processo de design.

Características principais:

• Adicionar um novo widget de tabela ao Elementor
• Obtenha acesso a vários modelos de tabela
• Adicione imagens, texto, botões, listas e ícones dentro de tabelas

Preço: DataMentor é um plugin gratuito.

10. Complementos felizes para Elementor

Happy Addons for Elementor é um dos plugins mais abrangentes para o construtor de páginas. Essa ferramenta adiciona mais de 99 widgets ao Elementor e uma ampla coleção de novos modelos à sua biblioteca.

No que diz respeito às tabelas, o Happy Addons inclui widgets de tabela básicos e avançados. A versão avançada suporta dados importados em vários formatos, bem como pesquisa, filtragem e paginação. Além disso, você obtém acesso a vários layouts de mesa pré-projetados. Além dessas opções, o Happy Addons também inclui elementos de tabela de preços e comparação.

Características principais:

• Acesso a widgets de tabela básicos e avançados
• Importar dados para habilidades avançadas
• Use layouts de mesa pré-projetados
• Adicionar tabelas de preços e comparação

Preço: Existe uma versão gratuita do Happy Addons. As licenças premium começam em $ 39 por ano.

11. Complementos Royal Elementor

Royal Elementor Addons adiciona mais de 40 novos widgets ao Elementor. Todos são gratuitos, mas o plugin também vem em uma versão premium que desbloqueia opções adicionais de personalização para cada widget.

Com os complementos do Royal Elementor, você obtém uma nova tabela de preços para usar no Elementor. Este widget inclui várias novas opções de estilo. Além disso, ele vem com uma opção de alternância que os visitantes podem usar para alternar entre preços mensais e anuais (ou outras opções).

Características principais:

• Adicionar um novo widget de tabela de preços ao Elementor
• Personalize tabelas de preços com novas opções de estilo
• Adicione uma alternância de preço às suas tabelas

Preço: O Royal Elementor Addons é gratuito. As licenças premium custam US$ 29 por site (é uma taxa única).

12. Elementor Addon Elements

Elementor Addon Elements é um plugin gratuito que adiciona mais de 24 novos widgets ao Elementor. Entre eles, você tem opções de preço, comparação e tabelas de dados.

As tabelas de preços incluem muitas opções de personalização adicionais que o widget Elementor padrão não inclui. Quando se trata de tabelas de dados, você pode escolher entre criar elementos pesquisáveis ​​ou filtráveis. Além disso, as tabelas suportam animações, o que pode torná-las muito mais atraentes visualmente.

Características principais:

• Adicione tabelas de preços, comparação e dados ao Elementor
• Escolha entre tabelas de dados filtráveis ​​e pesquisáveis
• Adicionar animações às tabelas de dados

Preço: Elementor Addon Elements é gratuito.

Resumo

O Elementor fornece uma ampla gama de ferramentas para criar tabelas WordPress elegantes e complexas. Muitos plugins de tabela do WordPress também são compatíveis com o Elementor, o que significa que o construtor de páginas permite adicionar quase qualquer tipo de tabela que você deseja ao seu site.

O construtor de páginas Elementor vem com um widget intuitivo de Tabela de preços . Se você deseja adicionar outros tipos de tabelas, recomendamos o uso de plug-ins de tabela Elementor, como ElementsKit ou WP Table Builder.

Kinsta CDN é um CDN de alto desempenho disponível para todos os clientes Kinsta sem custo adicional. Ele é alimentado por nossa integração gratuita da Cloudflare e atende automaticamente seu conteúdo de mais de 200 PoPs em todo o mundo. Se você tiver alguma dúvida sobre Kinsta CDN, sinta-se à vontade para entrar em contato com nossa equipe de suporte 24 horas por dia, 7 dias por semana para obter mais assistência!