Create Graphs in Google Sheets and Insert in WordPress Website

There is no doubt that WordPress is the best CMS (Content Management Software) ever. It dominates the CMS usage with a 76.4% market share. It offers almost every basic feature and the features which are not there can be availed by using various WordPress Plugins.

Recently, I wanted to insert a chart/graph inside my WordPress post and tried installing various WordPress Chart Plugins but nothing worked as per the expectations. Some plugins were paid and some were pretty difficult to understand. Seriously, they were annoying.

Best Way to Insert Graphs in WordPress is to Create Graphs in Google Sheets and then Insert it in Your WordPress Website.

I researched a lot and found a simple solution to the problem; a chart can be created inside the Google Sheets and then inserted into your WordPress post. Yeah, it’s pretty simple and easy to do.

Create a New Google Sheet Document

To create a new Google Sheet document, first of all, you’ll need to go to sheets.google.com and Create a new blank spreadsheet. Name your document anything you want and go to the next step.

Charts for WordPress from Google Sheets

Fill in the Chart Data

Since the spreadsheet document has already been created now you need to type in the details that you want to create the chart for. There is no need for providing the column name.

Never Put % (Percent) in the Data Field.

In the A1 column, you can fill in the parameters and in the B1 column, data can be filled in as shown in the image below.

Charts for WordPress Google Sheets

Insert the Chart

Now select the filled-in data as shown in the above picture and then go to the Insert tab and click on the Chart, after that, a chart will be inserted into your spreadsheet. Below pictures will show you the same.

Charts for WordPress Google Sheets 2

After that Google sheets will detect and automatically insert suitable charts as per your data. You can also change the chart type by clicking on the Chart Type option which appears to be in the upper right section. There will be multiple chart types of options you can choose from.

Charts for WordPress Google Sheets 3

You can also customize your chart by going to the Customize tab which also appears to be in the top right part of the spreadsheet. There, you can customize various aspects of the chart like; Chart style, Chart and axis titles, Series, and Legend.

Charts for WordPress Google Sheets 4

Here’s a short video describing the same, take a look.

[youtube https://www.youtube.com/watch?v=kCcLbqDMgso%5D

Now that your chart has been created and customized as per your requirements, here comes the next main part of the tutorial…

Recommended Read: How to Store Contact Form 7 Data to Google Sheets

Publishing the Chart to Your WordPress Website

There are two ways to share the chart on your website; the first is as an image and the second is as an interactive chart.

Important: Do not forget to name your chart. You can do that by going to the Customize section, after that click on the Chart & axis title, and name your chart anything you want.

Charts for WordPress Google Sheets 5

To start publishing, go to the chart options and select Publish after that a window will pop up which will ask you to choose the type of chart that you want to publish on your website. You can either link or embed your document; if you link your document then it can be viewed only after clicking on the link, but you can show the chart directly on your website by embedding it.

Charts for WordPress Google Sheets 6

After that click on the publish and copy the embed link which will be used at your WordPress site in order to show the chart.

Charts for WordPress Google Sheets 7

Showing on Your WordPress Website

Login to your WordPress dashboard and open any post/page where you want to share the chart. After the WordPress editor opens, go to the text mode instead of visual mode and paste the copied embed code. You can also adjust the width and height of your chart by changing the values of width and height in the embed code.

Charts for WordPress Google Sheets 8

If you check the option Automatically republish when changes are made while creating the embed code then when you change the graph inside Google Sheets, it will automatically be changed on your WordPress website.

If you have any questions/queries then drop a comment in the comment section below.

Similar Posts

Leave a Reply to Karen Griffiths Cancel reply

Your email address will not be published. Required fields are marked *

0 Comments

  1. Invest Hero says:

    What about making it full width and interactive? Can’t figure that out unfortunately, it’s always a fixed size which makes it terrible for having a mobile+desktop friendly site

    1. Yes, unfortunately, embedded graphs from Google Sheets can’t be made responsive.

      However, you can change scrolling=”no” to scrolling=”yes” in the iframe code which will make the graph horizontally scrollable.

  2. Karen Griffiths says:

    can you point me to a website that has used this technique. I want to see what the graphs look like on the page before I go down this route. (A bit technologist challenged so need easy way to get graphs from my spreadsheet onto my pages.
    Thanks from Karen

    1. Hi Karen,
      I found a website which has used bar diagram/chart as well as the geo-interactive chart from Google Sheets on the WordPress Website.
      Here’s the link: https://aspiringyouths.com/indian-students-studying-abroad/
      Hope that helps. Let me know if you need more help.
      Thanks.

  3. Nathaniel Kam says:

    This is very cool, didn’t know there was a wordpress specific embed.