A maioria das pessoas que usam o WordPress não são desenvolvedores. Blogueiros, profissionais de marketing e proprietários de pequenas empresas - todos nós queremos criar tabelas limpas e profissionais sem precisar mergulhar no código. É aí que as tabelas WYSIWYG fazem a diferença.
WYSIWYG significa "What You See Is What You Get" (O que você vê é o que você obtém). Isso significa que você constrói e edita tabelas de uma forma que espelha a aparência final, exatamente como faria ao trabalhar em um documento do Word. Se o bloco Table padrão deixa você querendo mais, este guia é para você.
Hoje, mostrarei a você como criar uma tabela visualmente impressionante usando o plug-in WYSIWYG table builder. A tabela está abaixo.
O que é uma tabela WYSIWYG no WordPress?
Uma tabela WYSIWYG permite que você edite o conteúdo visualmente, diretamente no editor do WordPress. Sem HTML. Sem códigos de acesso. Apenas resultados em tempo real e controles intuitivos.
Você recebe:
-
Edição em tempo real sem recargas
-
Formatação flexível com mídia avançada
-
Uma sensação de arrastar e soltar para a estrutura
-
Fácil integração de imagens, ícones e botões
É a maneira mais fácil de criar tabelas com conteúdo rico sem sobrecarga técnica.
Por que o bloco de tabela padrão do WordPress é insuficiente
O bloco Table integrado faz o trabalho para layouts básicos, mas seus recursos acabam aí:
-
Sem arrastar e soltar para linhas ou colunas
-
Personalização limitada de bordas, espaçamento ou cores
-
Não é possível mesclar e dividir células
-
Não há suporte para mídia dentro das células
-
Baixa capacidade de resposta em dispositivos móveis
Se a sua tabela precisar de mais do que apenas texto simples, você terá dificuldades rapidamente.
Por que escolher um plug-in de tabela WYSIWYG?
Para liberar todo o potencial do design de tabelas, um plug-in visual de tabelas como o Tableberg é uma escolha inteligente. Ele oferece a você:
-
Editor visual: Faça alterações conforme você as vê - sem adivinhações
-
Arrastar e soltar: O rearranjo das células leva segundos
-
Blocos de mídia: Adicionar imagens, botões, ícones e classificações por estrelas
-
Estilos personalizados: Controle o preenchimento, as bordas, o alinhamento e as cores das células
-
Compatível com dispositivos móveis: Escolha como a sua tabela responderá em telas menores
Esse tipo de plug-in torna a criação de tabelas avançadas tão simples quanto editar uma postagem de blog.
Criar mesas bonitas
Com o Block Editor
🚀 Como criar uma tabela WYSIWYG com o Tableberg
Para criar uma tabela WYSIWYG com o Tableberg, primeiro precisamos instalar o plug-in.
1. Instalar o plug-in Tableberg
Ir para Plugins (1) > Add New (2), procure por "Tableberg" (3) e clique em Install (4) seguido de Activate (Ativar).
2. Adicionar uma nova tabela
Abra um post ou página onde você deseja adicionar a tabela. Clique no botão ícone de mais (+) no editor (1). Tipo Tableberg na caixa de pesquisa (2). Adicionar o bloco ao editor (3).
Defina o número de colunas e linhas da tabela. Selecionaremos 3 × 5 por enquanto, mas criará ou excluirá colunas e linhas, se necessário. Clique no botão Criar tabela no final.
Você verá a tabela inserida no editor em breve, como abaixo.
Etapa 3: Adicionar conteúdo visualmente
A. Inserir conteúdo de texto
Coloque o cursor nas células da tabela e digite o que desejar.
B. Adicionar imagens
Agora, insira o bloco de imagens para inserir as imagens de seus produtos clicando no botão "+". É possível carregar imagens ou selecionar na biblioteca de mídia.
C. Adicionar classificação por estrelas
Adicione classificações com estrelas, se desejar. A classificação por estrelas é uma ótima maneira de demonstrar a qualidade de seus produtos.
D. Adicione seus botões
Os botões são uma forma eficaz de promover qualquer produto ou serviço. Portanto, coloque-os estrategicamente
Vincular um botão também é fácil: clique no botão, selecione a opção de link, insira o link de destino e ajuste os atributos do link.
Você pode ajustar e personalizar seus botões no painel do lado direito.
E. Inserir ícones
Os ícones funcionam muito bem para informar quais recursos estão disponíveis e quais não estão. A inserção do bloco de ícones é igual à de qualquer outro bloco.
F. Inserir lista com estilo
O Styled List é outro bloco essencial que o ajuda a adicionar um conjunto de recursos com ícones simultaneamente.
Agora, adicione seus recursos. Sempre que pressionar a tecla "Enter" no teclado, você poderá adicionar novos recursos.
Você pode acessar as opções de personalização do bloco Styled List no lado direito do editor.
Aqui está a tabela que criei usando o Tableberg sem personalização.
Adicionei algumas cores, preenchimento, margem e faixa de opções na parte superior. Abaixo estão as imagens da personalização que fiz.
Aqui estão os códigos de cores que usei na tabela. (Cor do cabeçalho: #f3f3f3, Cor do plano de fundo da linha par: #3fad3d63, Cor do plano de fundo da linha ímpar: #d1dec8)
Após a personalização, a versão final é apresentada a seguir.
Nome do produto |
Canon EOS  $1400 Melhor opção |
Lumix GH6  $1200 |
|---|---|---|
Vedação contra intempéries |
||
Tela LCD sensível ao toque |
||
Recursos adicionais |
|
|
Conectividade WIFI |
Quando estiver satisfeito, publique ou atualize a página. Sua tabela com estilo visual já está no ar.
🔄 Outros plug-ins de tabela WYSIWYG que vale a pena considerar
Enquanto Tableberg oferece uma experiência suave e baseada em blocos, mas há outras opções sólidas, dependendo de suas necessidades:
-
Construtor de tabelas WP - Arrastar e soltar, suporte a conteúdo flexível, compatível com todos os construtores de páginas.
-
Mesas Ninja - Rico em recursos com integrações e lógica condicional
-
TablePress (com extensões) - Bom para grandes conjuntos de dados
Cada um tem seus pontos fortes, mas o Tableberg foi desenvolvido para funcionar nativamente com o Gutenberg e prioriza a edição visual.
Casos práticos de uso
As tabelas WYSIWYG são perfeitas para:
-
Comparações de preços e detalhamento de recursos
-
Tabelas de afiliados com botões e classificações
-
Grades de membros da equipe ou programações de eventos
-
Catálogos de produtos com células ricas em mídia
-
Detalhamento passo a passo de como fazer
-
Resumos de conteúdo para postagens longas em blogs
Se o seu conteúdo envolve estrutura ou comparação, essas tabelas o tornam mais envolvente e informativo.
Considerações finais
Criar uma tabela de boa aparência não deve ser um desafio técnico. Um plug-in WYSIWYG como o Tableberg dá a você a liberdade de criar tabelas que correspondam ao seu estilo de conteúdo, sem tocar em uma única linha de código.
Se você quiser exibir recursos, comparações ou listas dinâmicas, o Tableberg facilita essa tarefa.
Pronto para experimentar o Tableberg?
Comece a usar o Tableberg hoje mesmo ➔
Leia mais!
