Cómo crear barras y gráficos en WordPress con Visualizer

¿Quieres agregar barras y gráficos en WordPress? Las ayudas visuales como gráficos, barras, gráficos circulares y más son una manera perfecta de agregar datos de manera hermosa a su contenido. En este artículo, le mostraremos cómo crear barras y gráficos en WordPress con el plugin Visualizer WordPress Charts and Graphs.

El problema de las barras y los gráficos en WordPress

Hay muchos plugins de WordPress para agregar barras, cuadros y gráficos a su contenido. Sin embargo, la queja más común que hemos recibido de nuestros usuarios es que estos plugins generalmente son demasiado complicados de usar. Algunos de estos plugins incluso esperan que los usuarios agreguen datos en un código corto en formatos extremadamente complicados. En lugar de utilizar estos plugins, muchos usuarios terminan creando gráficos en sus aplicaciones de oficina y convirtiéndolos en imágenes. Podría funcionar si planea no cambiarlo nunca. Sin embargo, una imagen no sustituye a un gráfico interactivo en el que aparecen datos de carga útil cuando el usuario pasa el mouse sobre una sección en particular. Una solución de gráficos y gráficos ideal le permitiría:

• Agregue datos de una fuente de datos en su computadora o en la web.
• Llene gráficos, tartas, tablas y barras con sus datos.
• Cree impresionantes gráficos interactivos, coloridos y aptos para dispositivos móviles.
• Más importante aún, debería permitirle actualizar los datos cuando lo desee.

Dicho esto, veamos cómo el plugin Visualizer WordPress Charts and Graphs lo ayuda a hacer todo esto.

Creando barras y gráficos en WordPress con Visualizer

Lo primero que debe hacer es instalar y activar el plugin Visualizer WordPress Charts and Graphs. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress. Si bien la versión gratuita hace casi todo lo que necesita, también tiene Graphs Visualizer y Graphs Pro que agrega funcionalidad adicional al plugin, como agregar datos directamente usando una hoja de cálculo como una interfaz e importar datos de otros gráficos. Cuesta $ 79 por una licencia de un solo sitio con un año de soporte profesional y actualizaciones.
Notar: Este tutorial es para la versión gratuita del plugin. Tras la activación, debe visitar Medios »Biblioteca del visualizador página. Aquí es donde aparecerán todas sus tablas y gráficos.

Debe hacer clic en el botón Agregar nuevo para agregar su primer gráfico. Esto abrirá una ventana emergente en la pantalla. Verá diferentes tipos de gráficos disponibles con el plugin. Simplemente seleccione el tipo de gráfico que desea agregar y haga clic en el botón siguiente para continuar.

El siguiente paso es agregar su fuente de datos en formato CSV. Si guardó sus datos como una hoja de cálculo usando Excel, Google Sheets o cualquier otro programa, puede simplemente exportarlos como un archivo CSV. Puede descargar o guardar su archivo CSV en su computadora y luego cargarlo haciendo clic en el botón "Desde la computadora".

Su archivo CSV debe tener nombres de columna en la primera fila y un tipo de datos en la segunda fila. El plugin admite estos tipos de datos: cadena, número, booleano, fecha, hora, fecha y hora del día. Eche un vistazo a este archivo de muestra que creamos en Google Sheets.

Si está creando un archivo CSV con un editor de texto, eche un vistazo a este archivo CSV de muestra:

Navegador, visitantes
números de cadena
Cromo, 7894
Firefox, 6754
Internet Explorer, 4230
Safari, 2106
Ópera, 627

Agregar un gráfico en WordPress usando una hoja de cálculo de Google Drive

Si los datos de su gráfico se guardan como una hoja de cálculo en Google Drive, puede agregarlos a su gráfico sin exportarlos. Abra su archivo de datos en Google Spreadsheets y luego haga clic en Archivo »Publicar en la Web.

Aparecerá una ventana emergente en la que debe seleccionar cómo desea publicar este documento. Debe seleccionar Valores separados por comas (.csv) en el menú desplegable.

No olvide hacer clic en el botón "Publicar". Ahora verá la URL disponible públicamente de su hoja como un archivo CSV. Debe copiar esta URL y volver al gráfico del visualizador. Haga clic en el botón Desde la Web, luego ingrese la URL de su archivo csv de hoja de cálculo de Google.

Tan pronto como ingrese la URL, el plugin tomará su archivo CSV y mostrará una vista previa en vivo de su gráfico. Ahora puede hacer clic en el botón Crear gráfico para guardar su gráfico.

Agregar un gráfico o gráfico en publicaciones / páginas de WordPress

Agregar un gráfico o un gráfico a sus publicaciones y páginas de WordPress es tan fácil como agregar imágenes. Cree una nueva publicación / página o edite una existente a la que desee agregar el gráfico. En la pantalla de edición, haga clic en el botón Agregar medios encima del editor de publicaciones.

Aparecerá la ventana emergente de descarga de medios de WordPress. Debe hacer clic en la pestaña de visualizaciones en la columna de la izquierda. Cargará todos los gráficos que ha creado y guardado en este sitio.

Haga clic en el icono de inserción debajo de su gráfico. La ventana emergente desaparecerá y verá su gráfico agregado a su publicación de WordPress como un código corto.

Ahora puede guardar su publicación o página de WordPress y visitar su sitio web para ver el gráfico incrustado en su publicación de WordPress.

Editar los gráficos de su visor en WordPress

Puede editar y cambiar sus gráficos en cualquier momento. Solo visita Medios »Biblioteca del visualizador página. Desde allí, puede clonar un gráfico, eliminarlo o cambiar su configuración visual.

Actualizar los datos de un gráfico existente sin modificar el gráfico es bastante fácil con Visualizer. Si agregó datos de una hoja de cálculo de Google, todo lo que necesita hacer es actualizar los datos de la hoja de cálculo e ir a Archivo »Publicar en la Web y vuelva a publicar su hoja de cálculo. Sus cambios se reflejarán automáticamente en su gráfico. Por otro lado, si descargó un archivo CSV, debe actualizar el archivo CSV en su computadora. Una vez hecho esto, seleccione el gráfico que desea actualizar y haga clic en el enlace de edición debajo del gráfico. En la sección Cargar archivo CSV, simplemente cargue su nuevo archivo CSV. Los cambios en los datos se reflejarán automáticamente en los artículos o páginas donde haya insertado este gráfico.

Agregar un gráfico en un widget de barra lateral de WordPress

El espectador utiliza códigos cortos para insertar gráficos. Solo ve a Medios »Biblioteca del visualizador, verá un código corto debajo de sus gráficos. Copie el código corto y navegue hasta Apariencia »Widgets. Arrastre y suelte un widget de texto en su barra lateral y pegue el código corto dentro del widget. Si el código abreviado no funciona en el widget de texto, consulte nuestra guía sobre el uso de códigos abreviados en los widgets de la barra lateral de WordPress. Esperamos que este artículo le haya ayudado a agregar barras y gráficos a su sitio de WordPress. También puede consultar nuestra lista de 24 plugins de WordPress imprescindibles para sitios web comerciales.Si le gustó este artículo, suscríbase a nuestro canal de YouTube para ver tutoriales en video de WordPress. También puede encontrarnos en Twitter y Facebook.