Como criar belos infográficos e diagramas úteis no WordPress

Quer você seja um pesquisador coletando dados sobre as eleições locais ou um professor compartilhando dados sobre as populações locais de vida selvagem com sua classe, não há alternativas melhores do que tabelas e gráficos. Essas ferramentas visuais transformam dados enfadonhos e códigos aparentemente sem valor em informações de fácil digestão.

O que é ótimo é que você não precisa se preocupar em lidar com um construtor gráfico complicado, já que você pode fazer isso graças aos plug-ins simples do WordPress para criar tabelas e gráficos. Então, estamos aqui para explicar quais desses plug-ins são os melhores e também veremos como criar Lindos infográficos E formas em WordPress.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

Vantagens de criar gráficos, tabelas e figuras no WordPress

Você pode estar se perguntando por que não pode simplesmente desenvolver o diagrama em um programa, digamos, Excel, e depois fazer uma captura de tela e colocá-la em uma postagem de blog. Às vezes, esse método funciona bem, mas outras vezes é um grande desperdício se não for posicionado e fotografado com precisão. O principal motivo para usar o Excel ou outro programa para construir um diagrama é quando você precisa de um recurso avançado que você não tem por meio de um plug-in do WordPress.

Caso contrário, aqui estão os benefícios de criar diagramas e gráficos no WordPress com plug-ins:

  • Ele mescla seu diagrama e construção em uma área. Se você faz gráficos regularmente, isso economiza muito tempo.
  • Ele permite que você volte e edite o gráfico, se necessário. A imagem limita o hotfix e exige que você encontre o arquivo antigo usado para fazer o gráfico.
  • Alguns diagramas e gráficos possuem recursos interativos, o que não seria possível com uma imagem.

No geral, adicionar um layout do WordPress simplifica o processo, mas ainda fornece a maioria dos recursos que você precisa compartilhar em seu blog.

5 plug-ins poderosos para a criação de gráficos e diagramas para WordPress

Antes de começarmos com o tutorial sobre como criar lindos infográficos e diagramas no WordPress, queremos que você use alguns dos melhores plug-ins para fazer o que precisa.

  1. wpDataTables
  2. Tabelas e gráficos do WordPress Lite
  3. Gráficos WordPress
  4. Mapas, tabelas e gráficos interativos
  5. UberChart

1. wpDataTables

wpDataTables É um plugin WordPress muito poderoso! Não se deixe enganar pelo nome. Ele pode fazer muito mais do que apenas criar suas próprias tabelas de amostra. Você também pode criar todos os tipos de gráficos e tabelas. Foi especialmente desenvolvido para permitir que você insira rapidamente grandes quantidades de dados e os transforme em uma apresentação gráfica que seja agradável para você e seus leitores.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

wpDataTables é um plugin pago, a partir de $ 44 por licença. Atualmente, ele tem mais de 13 vendas no CodeCanyon com 000 de 4.5 estrelas, então você pode ter certeza de que muitas pessoas ficam felizes em usá-lo. Alguns de seus recursos incluem:

  1. Tudo responde com o tipo de pré-embalagem usado, o que significa que aparecerá com uma boa variedade para cada dispositivo
  2. WpDataTables oferece três motores de gráfico diferentes: Google Charts, Highcharts e Chart.js. Isso permite que você apresente gráficos de uma forma simples e flexível, com muitas opções para personalizá-los.
  3. Com atualização automática de gráficos e gráficos em tempo real
  4. Visualize seus gráficos em segundo plano junto com a programação

2. Tabelas e gráficos do WordPress Lite

Se você deseja exibir dados e informações em seu blog WordPress usando belos gráficos e tabelas, olhe além do melhor. Tabelas e gráficos do WordPress Lite. Ele faz um ótimo trabalho na criação de belas imagens interativas, ao mesmo tempo que lhe dá total liberdade para personalizar a saída para torná-la adequada às suas necessidades: você pode alterar cores, personalizar fontes, ocultar texto, adicionar texto - tudo isso mesmo depois de publicar o layout. Exibir os diagramas em suas postagens e páginas é tão simples quanto fazer o upload de uma planilha e adicionar automaticamente o shortcode gerado pelo plugin à sua página.

E mais tarde, se você decidir alterar o tipo de gráfico de gráfico de bloco para gráfico de pizza, aperte o botão de edição e selecione Alternar. Sim, é realmente fácil. Também é importante notar que os gráficos produzidos podem funcionar em todas as telas de dispositivos (computadores desktop, tablets e telefones celulares) de todos os tamanhos, pois esse acréscimo é responsivo.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

Inclui nove tipos de gráficos, suporte para códigos curtos e uma opção para importar muitos dados com CSV. Existe uma versão gratuita e uma paga. A versão Pro paga pelo menos $ 74 (uma licença de site) e fornece ferramentas para importação de outros gráficos. A versão Pro inclui alguns outros recursos:

  • Opção para dar aos usuários recursos de edição
  • Crie seu esquema
  • Sincronização automática com seu arquivo online
  • Tipos de gráficos adicionais
  • Você pode acessar um editor ao vivo

O plugin do Lite ainda é muito poderoso. Aqui estão alguns gráficos que você pode fazer:

  1. Gráfico de linha
  2. Gráfico de pizza
  3. Gráfico de barras
  4. Gráfico de colunas
  5. Esquema de área
  6. Carta geográfica
  7. Quadro gráfico
  8. Gráfico de calibre
  9. Balanças
  10. Esquema de combinação
  11. Gráfico de dispersão
  12. Linha do tempo

3. Gráficos WordPress

Adição Gráficos WordPress Será minha terceira escolha, muitos usuários amam este plugin por seus designs limpos, animação e opções coloridas. No entanto, também esteja ciente de que ele não foi atualizado por um tempo.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

O plug-in WordPress Charts fornece seis gráficos e modelos de gráficos exclusivos, que você pode configurar e incluir seus dados para exibição em seu site. Os esquemas exibidos incluem:

  1. Linha
  2. شريط
  3. Torta
  4. radar
  5. Região polar
  6. Tipos de rosquinha

Todos esses diagramas foram criados em HTML5. As opções de personalização são praticamente infinitas, mas você terá que saber um pouco sobre codificação, códigos de acesso ou pelo menos definir as configurações padrão. A razão pela qual recomendamos tanto os gráficos do WordPress é que eles são muito leves. Você pode inserir dezenas de diagramas em todas as suas postagens de blog e não terá problemas. E esse é o ponto principal de trabalhar com HTML5. Você pode remover a desordem sem sacrificar nenhuma funcionalidade.

4. Mapas, tabelas e gráficos interativos

Se você atualmente tem um plug-in Visual Composer em seu site, este pode ser um complemento Mapas, tabelas e gráficos interativos Característico de você. É um add-on para o Visual Composer, então não há razão para fazer o contrário.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

O complemento é vendido por US $ 12, que oferece mapas, gráficos e tabelas interativos, e é colocado na interface do Visual Composer. A extensão vem com ícones vetoriais, fontes do Google, cores ilimitadas e uma ampla gama de outros recursos para criar e personalizar gráficos, tabelas e tabelas. O plugin contém tabelas e gráficos padrão, como gráficos de pizza e linhas. Há também um recurso de mapa exclusivo para destacar áreas específicas, seja um mapa local ou um do mundo.

5. UberChart

Adição UberChart É mais versátil do que os plug-ins pagos, pois o plug-in não requer o Visual Composer. O plugin oferece 10 tipos de gráficos integrados, que recebem cerca de 240 opções para personalização de gráficos.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

Você pode exportar e importar dados com o clique de um botão, e o design responsivo garante que todos os seus gráficos apareçam em todos os dispositivos. Alguns tipos de gráficos incluem:

  1. Diagramas de linha
  2. Esquemas de área
  3. Gráficos de barras
  4. Gráfico de setores
  5. Gráficos de rosca
  6. Bolhas de projetos

A parte mais impressionante deste plugin UberChart para WordPress é o editor de planilhas. Ele permite que você copie dados de qualquer programa que desejar (como o Excel) combinando recursos mais avançados do Excel e a versatilidade do plugin UberChart.

Como criar lindos infográficos e diagramas no WordPress

Um dos nossos plug-ins de criador de layouts favoritos é Tabelas e gráficos do WordPress Lite. Então, estamos apenas passando por este tutorial com esta extensão deste plugin. Outros plug-ins de diagramação têm ferramentas semelhantes, mas interfaces diferentes. Portanto, eu recomendaria testar todos eles para ver qual é o certo para você, wpDataTables também é um plugin muito poderoso!

Etapa 1: instale e ative WordPress Charts and Graphs Lite

Simples o suficiente.

Etapa 2: vá para a Biblioteca do Visualizer e adicione um novo diagrama

Como mencionamos brevemente acima, o WordPress Charts and Graphs Lite também é conhecido como um visualizador. A página de configurações é um tanto difícil de encontrar, mas tudo que você precisa fazer é ir para Mídia> Biblioteca do Visualizador. Não há outras configurações que você precise definir antes de começar com seus layouts do WordPress.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

Ao fazer o download da Biblioteca do Visualizer, você verá uma mensagem dizendo “Nenhum esquema encontrado”. Tudo bem, porque ainda não fizemos nenhum projeto. Portanto, você deve clicar no botão Adicionar Novo no topo da página.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

Isso revela todos os layouts e gráficos do WordPress que você pode criar com o plugin. Por exemplo, ele tem gráficos de pizza, linha, área, geográfico e de barras. Nove tipos de gráficos são fornecidos na versão gratuita. Você pode obter mais gráficos se tiver pago pela versão paga. De qualquer forma, vou escolher um gráfico de pizza para este tutorial.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

Etapa 3: importe os dados para o esquema do WordPress

O plugin insere automaticamente os dados para que o gráfico tenha algo para exibir. No entanto, para apresentar seus dados, você precisará importá-los usando um dos cinco métodos. Você poderia:

  • Importar dados de um arquivo (talvez o método mais comum)
  • Importar dados do URL
  • Importar de outro esquema
  • Importar do WordPress (disponível apenas na versão Pro)
  • Importar dados manualmente (disponível apenas na versão Pro)

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

Por exemplo, vou importar dados de um arquivo CSV. Eu o criei a partir de um arquivo Excel, que é uma das formas mais populares de inserir dados em um gráfico ou gráfico wordpress. Ao importar dados de um arquivo, clique no botão Escolher arquivo, procure o arquivo em seu computador e clique no botão Importar no Painel de controle do WordPress.

Isso deve mostrar a você uma prévia de como seus dados ficarão à direita. A boa notícia é que você sempre pode voltar e definir o formato para um arquivo CSV e tentar novamente. Existem também várias ferramentas de personalização na próxima etapa para tornar as coisas um pouco melhores.

Etapa 4: personalize o layout do WordPress

Existe um pequeno link que diz "Avançado" na parte inferior de todas as opções de importação. Clique aqui para mostrar as configurações de personalização. Existem muito poucas opções para brincar, então não vamos passar por todas elas aqui.

Mas podemos começar com o título do gráfico. Vou digitar algo como "Para onde está indo seu tempo?" Onde meu planejador determina a porcentagem de tempo que as pessoas passam em certas tarefas ao longo do dia. Também posso alterar a fonte, o tamanho da fonte, a cor e a localização do título.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

Conforme você se move pelas configurações, você notará várias guias para coisas como configurações gerais, configurações de slides, ações frontais e muito mais. Como essa é uma parte essencial do gráfico, você provavelmente precisará localizar a legenda.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

Fora isso, tudo depende inteiramente do tipo de gráfico que você está tentando fazer e dos elementos que precisa exibir. Vou fingir que este é o projeto do WordPress para vários de meus alunos. Portanto, gostaria de dar a eles a opção de imprimir e fazer download de dados e gráficos.

Para fazer isso, vá para a guia Ações de front-end. Isso revelará caixas de seleção para permitir que os usuários imprimam e copiem dados. Você também pode fornecer planilhas Excel e CSV para download. Depois de terminar de personalizar o gráfico, certifique-se de salvá-lo.

Etapa 5: copie o shortcode para a página ou postagem

Depois de salvar seu layout ou gráfico do WordPress, volte para a Biblioteca do Visualizer. Você verá uma lista de gráficos, que pode filtrar com base nos tipos de gráfico. E como agora tenho apenas um gráfico, posso ver imediatamente que é a única opção. Para publicar seu esquema WordPress em uma página ou postagem, você deve copiar o shortcode do diagrama e colá-lo na página ou postagem desejada. O ícone curto está localizado sob a visualização do contorno (veja a imagem abaixo).

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

Depois de copiar o código curto, você deve criar uma página ou postagem, ou ir para uma das que já foram publicadas. Encontre onde deseja que o gráfico apareça e cole o código de acesso lá.

Etapa 6: Exibir o infográfico do WordPress

Eu recomendo visualizar o gráfico antes de clicar no botão Publicar. Dessa forma, você pode ver o que seus usuários estão vendo, especialmente diagramas e gráficos do WordPress, que podem ser complicados. Se você der uma olhada na captura de tela abaixo, verá uma prévia do diagrama de teste no front end do site. Os botões de impressão e upload são visíveis, o layout do WordPress tem algumas animações legais quando você passa o mouse sobre ele e as cores e os elementos do título têm uma boa aparência.

Como criar gráficos bonitos e úteis no WordPress - WordPress Professional WordPress

As alterações acontecem instantaneamente na visualização ao vivo para que você possa ver como elas afetam o gráfico sem ter que salvar a página e visualizá-la em uma nova guia. Há um outro recurso digno de nota, e é incrível. Você não só pode editar as opções de design do diagrama, mas também pode editar os dados dentro dos diagramas, carregando outro arquivo, sobrescrevendo o original e substituindo os dados antigos pelos novos.

Dúvidas sobre a criação de infográficos no WordPress?

Todos os diagramas e gráficos do Wordpress têm funções diferentes. A parte legal dessas adições é que você tem toda a flexibilidade. Portanto, eu o encorajo a passar algum tempo testando os gráficos e entendendo o que pode ser feito com cada ajuste. Então, você eventualmente se tornará o mestre dos projetos e as pessoas lhe perguntarão como fazer isso. Se você tiver dúvidas ou ideias sobre como criar diagramas e gráficos em WordPress, fale nos comentários abaixo.

Ir para o botão superior