Graphina Documentation

How to Fetch Dynamic Data for WordPress Charts Using an API

Introduction

If you’ve been following my blog, you know how much I love creating data visualization charts in WordPress. But what if you could fetch live data from an API without writing a single line of code?

In this guide, we’ll learn how to convert a static chart into a fully dynamic chart using an API as a data source.

How to Integrate an API with WordPress Charts

Step 1 – Select a Chart

  • Open Graphina – WordPress Chart Plugin.
  • Choose the chart where you want to display live API data.

Step 2 – Change Data Source to Dynamic

  • In the chart data settings, switch the source from “Manual” to “Dynamic”.
  • If you see a “No Data Available” message, don’t worry—it just means the data source isn’t connected yet.

Step 3 – Connect an API

  • In the Dynamic Data Options, select “API” as the data source.
  • A URL input box will appear.
  • Copy the API endpoint URL and paste it into the input box.

Step 4 – Handling API Authorization (Header Keys & Tokens)

  • Some APIs require an API key or authentication token for access.
  • In the API settings, enter the required header key and header token, if applicable.
  • This ensures secure and authenticated access to external data sources.

Step 5 – Adjust Data Elements

  • In the chart data settings, increase the data elements to match the API response.
  • The chart will update automatically, reflecting the latest data from the API.

Key Benefits of Using an API for WordPress Charts

✅ Live Data Integration – Fetch real-time data without manual updates.
✅ Seamless API Authentication – Use API keys and tokens for secure data access.
✅ Instant Updates – Charts auto-refresh as new API data becomes available.

With these simple steps, you can easily integrate live API data into your WordPress charts and make them fully dynamic! 🚀

How to add Header Key and Header Token

Some APIs use API keys for authorization.

An API key is a special token that the client needs to provide when making API calls.

  •  Follow the below steps to learn how to create WordPress charts from external API’s – 

Step 1 –  Selection of Chart 

Open Graphina – WordPress Chart Plugin and select the chart where you want to display the data of google sheet. 

Step 2 – Changing Data Option from Manual to Dynamic

Select the chart data option and change the time from “manual” to “dynamic” and we can see the message of the no data available because we have not selected the data source till now. 

Step 3 – Adding WordPress Charts from External API’s

Select the dynamic data option and change the type to “API.”

Below, you have the option to paste the URL link. 

So now you have the option to paste the URL, copy it, and paste it to the given box.

Step 4 – Increasing Elements

Here on the chart, you can see there are five elements select the “chart data option” and increase the data element by 5, and you will be able to see the changes on your page. And the data of the API is displayed here with the least amount of effort.