Build Charts In Seconds With The Chart Blocks For Gutenberg Plugin

For those who are not yet convinced of the beauty of Gutenberg as an editor for WordPress, I believe this Chart Blocks For Gutenberg plugin could change your mind. How would you do this in such an easy and elegant manner with the classic editor? (hint: you don’t).

With this plugin, you can create all kinds of charts within the Gutenberg editor within seconds. Here are the types of charts you can build:

  1. Bar Chart Block
  2. Line Chart Block
  3. Pie Chart Block
  4. Doughnut Chart Block
  5. Horizontal Bar Chart Block
  6. Horizontal Line Chart Block

You can see an example of a chart created this way below this paragraph.

As you can see, the resulting chart is both responsive and interactive, which is pretty stunning given how painful it can be to create charts with code.

How to use Chart Blocks for Gutenberg to create charts in WordPress?

The process couldn’t be any simpler.

First, you must install the WordPress plugin. Once it’s done, in any post, you can start a new block with /chart (or by picking with the Add Block link and searching for chart). You will see the chart options, select one and you can set it up.

To set up the chart, you must first fill in the data by uploading a CSV file. There is a sample CSV file you can download to have the right structure for your date. Upload it and it’s good.

Once this is done, you can customize it further by changing the colors of the bars or parts of the pie chart.