WordPress y visualización de datos

Publicado: 2022-02-04

¿Tiene una gran cantidad de datos que desea presentar en su sitio web de WordPress en formato gráfico? ¿Quizás algunas estadísticas de ventas o datos que le muestren a un cliente cómo ha mejorado el tráfico a su sitio web durante un período de meses? Cualquiera que sea la razón, la presentación de datos de una manera visual hace que sea mucho más fácil comunicar los puntos centrales con su audiencia, además de ser más agradable... después de todo, a menos que sea un verdadero geek de los números, estudiando minuciosamente hojas de cálculo con filas y filas de números. es idea de nadie de mucha diversión!

Puede que le guste la idea de presentar los datos de forma visual, pero la pregunta clave es "¿cómo se hace?". Puede ser tentador crear un gráfico o gráfico circular en algún software de diseño gráfico (como Canva) y luego colocar la imagen en su sitio web. Eso ciertamente hará el trabajo, pero ¿y si hubiera una mejor manera?

Afortunadamente, existe y, al ser WordPress, ¡todo comienza con un complemento! En este artículo, veremos algunas de las opciones de complementos disponibles para ayudarlo a mostrar esos datos de una manera fácil de usar, interesante y legible. ¡Vámonos!

Gráficos fáciles

El complemento Easy charts es un complemento popular y gratuito que hace el trabajo. No se ha actualizado por un tiempo, pero esto parece ser más el resultado de que continúa funcionando bien 'tal como está' que debido a una negligencia significativa.

Está bien presentado y es bastante sencillo para comenzar. Una vez que esté instalado, diríjase directamente al enlace del menú 'Agregar nuevo' desde el área de administración de Easy Charts.

Verá que puede agregar datos en filas y columnas (al igual que lo haría en un Excel u otras hojas de cálculo). Como beneficio adicional, hay un panel de vista previa para que pueda ver los resultados sobre la marcha.

Se detalla la configuración. Puede personalizar el estilo, la tipografía, la leyenda, los colores y más para lograr el aspecto que desea. Hay varias formas en que se pueden presentar sus datos... la que elija dependerá en gran medida del tipo de datos que esté presentando.

  • Gráfico de barras
  • Gráfico de área
  • Gráfico de barras apiladas
  • Gráfico de áreas apiladas
  • Gráfico de barras de porcentaje
  • Gráfico de porcentaje de área
  • Gráfico circular
  • Gráfico de anillos
  • Gráfico de barras ascendente
  • Gráfico de cascada
  • Gráfico de linea
  • Gráfico de área polar

Cuando haya creado su gráfico, se le dará un código abreviado que luego puede pegar en una publicación o página. Alternativamente, puede agregar su gráfico directamente desde el interior del editor visual, si está utilizando uno, con la ayuda de un botón de inserción rápida "Gráficos fáciles".

El complemento se desarrolló utilizando la biblioteca uvCharts Javascript y crea gráficos con transiciones SVG y CSS3. Como beneficio adicional, también puede descargar cualquier gráfico que cree como un archivo de imagen. Finalmente, también notará que los gráficos son receptivos... algo imprescindible en el mundo actual del diseño web móvil primero.

visualizador

El complemento Visualizer es otra opción popular para crear gráficos y diagramas atractivos y receptivos para su sitio web. Con más de 40,000 instalaciones y una gran cantidad de excelentes críticas, es una excelente opción.

Después de instalar y activar el complemento, debería verlo en el menú de WordPress. Haga clic en "Visualizador -> Agregar nuevo gráfico" para agregar su primer gráfico.

Aparecerá una ventana emergente que lo guiará a través del proceso de selección de opciones que sean perfectas para sus requisitos gráficos particulares.

Tienes 6 plantillas gratuitas para elegir:

  • Mesa
  • pastel/rosquilla
  • Línea
  • Área
  • Geo
  • Bar

Puede cargar sus datos CSV localmente o importar datos desde un archivo CSV remoto o una hoja de cálculo de Google. Probablemente querrá descargar el archivo CSV de la plantilla primero, sin embargo, para verificar que sus datos estén estructurados de una manera que el complemento los entienda. Como alternativa, puede importar datos desde una fuente JSON remota o agregar datos manualmente.

En la pestaña Configuración, encontrará una variedad de opciones que le permiten modificar el estilo de su gráfico antes de publicarlo.

Una vez que haya creado su gráfico, puede copiar su código abreviado asociado o exportarlo como un CSV o una imagen. El complemento Visualizer utiliza la API de visualización de Google, DataTables.net y ChartJS para lograr lo anterior.

wpDataTables

El complemento wpDataTables es otra excelente opción para crear tablas de datos y gráficos para mostrar en su sitio web de WordPress. Es un complemento premium, pero ofrece una versión gratuita liviana que puede proporcionar suficientes funciones para muchos proyectos.

Una vez instalado y activado, diríjase a "wpDatatables -> Create a Chart" para comenzar.

Puede usar el asistente y seguir los pasos para crear el gráfico de su elección. Establezca un nombre para el gráfico, elija el motor de representación y el tipo de visualización y luego obtenga los datos de origen que deben ser una tabla creada con el mismo complemento.

Veamos este proceso con un poco más de detalle para examinar una función que no ofrecen los complementos mencionados anteriormente. Haga clic en "Crear una tabla" para comenzar.

Como puede ver, puede crearlo desde cero o extraer el contenido de la tabla de una fuente existente. Para este ejemplo, elegiremos crear a partir de una fuente existente. Después de hacer clic aquí, se nos pedirá que elijamos el "Tipo de fuente de datos de entrada".

En la versión gratuita, podemos usar el formato de archivo CSV, Excel, XML o JSON o proporcionar un objeto serializado PHP.

Aloje su sitio web con Pressidium

GARANTÍA DE DEVOLUCIÓN DE DINERO DE 60 DÍAS

VER NUESTROS PLANES

Esta es una gran característica ya que ofrece la opción de presentar datos de su base de datos. Esto no es lo más fácil de hacer, pero bueno, ¡estamos listos para un desafío!

En este ejemplo, digamos que queremos ver algunas estadísticas que muestren la cantidad de publicaciones en las páginas.

El código PHP que genera la matriz serializada debería verse así:

 <?php include('wp-blog-header.php'); header("HTTP/1.1 200 OK"); $return_array = array(); $posts_query = new WP_Query( array( 'post_type' => 'post', 'post_status' => 'publish' ) ); $pages_query = new WP_Query( array( 'post_type' => 'page', 'post_status' => 'publish' ) ); $posts = $posts_query->found_posts; $pages = $pages_query->found_posts; $return_array[] = array( 'Type' => 'Posts', ' Count' => $posts ); $return_array[] = array( 'Type' => 'Pages', 'Count' => $pages ); echo serialize( $return_array ); ?>

De acuerdo con la documentación oficial proporcionada por wpDataTables, las entradas de la matriz principal se analizarán como filas, las claves de la matriz secundaria se analizarán como encabezados de columna y los valores de la matriz secundaria como valores de celda.

Guardamos el código en un archivo que llamamos test.php y, para los fines de este ejemplo, lo colocaremos en la carpeta raíz de nuestra instalación de WordPress.

De vuelta en el área de administración, completaremos la ruta del archivo de esta manera:

Guardamos los cambios y listo.

Ahora podemos establecer la tabla como fuente del gráfico, seleccionar el tipo de gráfico y guardar el gráfico. ¡Simple como eso! Los pasos finales son seguir el Asistente hasta su conclusión, lo que implicará ajustar las configuraciones disponibles para obtener el diseño que desea para su gráfico. Después de eso, eres libre de publicarlo.

Conclusión

Es increíblemente útil poder mostrar datos de forma visual en un sitio web. Sin embargo, muchos usuarios de WordPress simplemente no se dan cuenta de que es algo relativamente fácil de hacer con la ayuda de un complemento. Esperemos que lo anterior le haya dado una idea de las opciones disponibles para usted. ¡Feliz construcción de gráficos!