Skip to content
iqonic
iqonic iqonic
  • DealsHot
    • 3D Deal only $19
    • HopeUI Pro40% OFF
    • KiviCare30% OFF
    • Handyman30% OFF
    • ProKit30% OFF
    • Graphina30% OFF
  • Free
    • menu-image
      WordPress
      Best Free WordPress Themes
      menu-image
      WP Plugins
      Free Open source plugins
      menu-image
      Admin Dashboards
      Free Open source dashboards
      menu-image
      Mobile Apps
      Free Mobile UI Kits & apps
      menu-image
      Site Templates
      Free HTML Website Templates
      menu-image
      3D Assets
      Stunning 3D bundles
      menu-image
      WordPress new
      Best Free WordPress Themes
      menu-image
      WP Plugins
      Free Open source plugins
      menu-image
      Admin Dashboards
      Free Open source dashboards
      menu-image
      Mobile Apps new
      Free Mobile UI Kits & apps
      menu-image
      Site Templates
      Free HTML Website Templates
      menu-image
      3D Assets
      Stunning 3D bundles
  • WordPress
    • menu-image
      WordPress Themes
      Premium Quality WP Themes
      menu-image
      WordPress Plugins
      Fully Functional WP Plugins
      xamin
      menu-image
      WordPress Themes
      Premium Quality WP Themes
      menu-image
      WordPress Plugins
      Fully Functional WP Plugins
      xamin
  • Admin Themes
    • menu-image
      HTML
      HTML CSS Dashboards
      menu-image
      Vue
      Free Open source plugins
      menu-image
      React
      React JS Dashboards
      menu-image
      Angular
      Angular JS Dashboards
      hopeui
      menu-image
      HTML
      HTML CSS Dashboards
      menu-image
      Vue
      Free Open source plugins
      menu-image
      React
      React JS Dashboards
      menu-image
      Angular
      Angular JS Dashboards
      hopeui
  • Mobile
  • All Items
  • HIRE USNEW
0

No products in the cart.

  • Sign in
    Sign Up
The secret way to create WordPress Charts from Firebase – Under 3 Mins | Iqonic Design wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins ext
  • February 12, 2022
  • Sagar Soni
  • Graphina
  • Web Development
  • WordPress

The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins

Are you looking for a way to create charts/graphs with your WordPress site using as little effort as possible? This quick tip will show you an easy way to get started by creating the bar graph from Firebase.

As we saw earlier what is dynamic data? and commonly used data sources it’s time to use them. In this blog, we will create our WordPress Charts from Firebase – Under 3 Mins. 

  • Follow the below steps for learning how to create a WordPress chart from Firebase – Under 3 Mins  

Step 1 – Selection of Datatable

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 1 3

Open Graphina – WordPress Chart Plugin and select the Data Table where you want to display the dynamic data. 

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins Step 1 Select the column chart

For example, choose the stacked Column chart where you want to display data of your firebase. 

Step 2 – Changing Data Option from Manual to Dynamic

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 3 8

Go to the chart data option and change the type from “manual” to “dynamic” and we can see the message of the no data available that’s because we have not selected the data source till now. 

Step 3 – Adding Dynamic Data Tables in WordPress through Firebase

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 3 7

Select the dynamic data option and change the type to “Firebase”

Step 4 – Firebase Configuration

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 5 5

We now have a new section “Firebase Data Configuration” that asks us to upload the configuration file.

Step 5 – Configuration File

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 6 4

Entering there you can upload “configuration file”. So, we first need to create a new project.

Step 6 – Creating a New Project

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 7 4

Go to firebase and create a new project. 

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 8 3

Name that project “graphina-Firebase”

Read the info and continue

Step 8 – Creating a Project

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 9 5

Selecting the account: From dropdown choose “Default firebase account” and then create a project.  

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 10 5

It will take some time but soon after the project is done, click on continue.

Step 9 – Generating Key

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 11 3

Go to project overview

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 12 4

Click on the project setting and then go to “service account” 

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 13 2

Then generate a private key from the option available and download the generated key. 

Step 10 – Realtime Database

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 14 3

Then you can create the database by clicking on the “real-time database” 

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 15 1

Select the location on real-time database then next 

Step 11 – Test Mode

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 16 1

And choose “start with test mode”

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 17 1

Then we will import the JSON file that was downloaded from the system.

Step 12 – Final Step

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 18

Click on Import 

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 19

Now copy the generated link 

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 20

And will paste it to “Database URL” 

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 21

And upload the config file by option available and it will be the security key that was downloaded. 

wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins 22

Once it’s done you will see the data on the chart using the firebase data source. 

Hereby, all the steps are covered for creating WordPress Charts from Firebase – Under 2 Minutes 

That’s all for the firebase in dynamic data. 

Now we have completed all the data sources available in graphina – WordPress Graph Plugin. 

Conclusion

Now as you have the knowledge on how to create WordPress Charts from Firebase – Under 3 Mins. You will learn more with us, while you have the nicest product of our Graphina – WordPress Plugin. 

Make Sure to Subscribe to our newsletter for the latest theme, templates, and tools to let you Structure and Fortunate Web-project without any sedulous dealing with coding skills. Don’t Forget to Subscribe to our Youtube channel to get an instant video tutorial. Follow us on Facebook and Instagram to get Quick Tips, Educational Posts, infographics, and a lot more. 

  • Tags:
  • data sources available in graphina
  • Default firebase account
  • firebase data source
  • Share it:
wordpress charts from firebase wordpress chart plugin stacked column chart The Secret Way to Create WordPress Charts from Firebase – Under 3 Mins IMG 20220419 181807 scaled
Author

Sagar Soni

259 posts
Sagar is a Content Head, Writer, and creative thinker at Iqonic Design. He often deals with multiple tasks at same time. Well! He is all rounder in Writing skills. And whenever you do not find him writing he is either studying about his counselling psychology or often exploring new places and goofing around with ambition achieving friends and plan on making new money moves.
Was this article helpful?
YesNo
Products
  • WordPress ThemesUp to 50% OFF
  • WordPress PluginsUp to 40% OFF
  • Admin TemplatesUp to 40% OFF
  • Website TemplatesUp to 40% OFF
  • Flutter AppsUp to 40% OFF
Blog
  • Freebies
  • Hope UI
  • Graphina
  • Business
  • WordPress
  • Mobile App Development
Support
  • Tech Support
  • Get A Quote
  • Contact Us
  • Support Policy
  • Licenses
Company
  • About
  • Terms of Use
  • Privacy Policy
  • Refund Policy
  • Newsletter
  • Donation
  • Careers
iqonic1

Copyright 2023. Made with love by Iqonic Design.

img
img
cristmas logo
  • DealsHot
    • 3D Deal only $19
    • HopeUI Pro40% OFF
    • KiviCare30% OFF
    • Handyman30% OFF
    • ProKit30% OFF
    • Graphina30% OFF
  • Free
    • menu-image
      WordPress
      Best Free WordPress Themes
      menu-image
      WP Plugins
      Free Open source plugins
      menu-image
      Admin Dashboards
      Free Open source dashboards
      menu-image
      Mobile Apps
      Free Mobile UI Kits & apps
      menu-image
      Site Templates
      Free HTML Website Templates
      menu-image
      3D Assets
      Stunning 3D bundles
      menu-image
      WordPress new
      Best Free WordPress Themes
      menu-image
      WP Plugins
      Free Open source plugins
      menu-image
      Admin Dashboards
      Free Open source dashboards
      menu-image
      Mobile Apps new
      Free Mobile UI Kits & apps
      menu-image
      Site Templates
      Free HTML Website Templates
      menu-image
      3D Assets
      Stunning 3D bundles
  • WordPress
    • menu-image
      WordPress Themes
      Premium Quality WP Themes
      menu-image
      WordPress Plugins
      Fully Functional WP Plugins
      xamin
      menu-image
      WordPress Themes
      Premium Quality WP Themes
      menu-image
      WordPress Plugins
      Fully Functional WP Plugins
      xamin
  • Admin Themes
    • menu-image
      HTML
      HTML CSS Dashboards
      menu-image
      Vue
      Free Open source plugins
      menu-image
      React
      React JS Dashboards
      menu-image
      Angular
      Angular JS Dashboards
      hopeui
      menu-image
      HTML
      HTML CSS Dashboards
      menu-image
      Vue
      Free Open source plugins
      menu-image
      React
      React JS Dashboards
      menu-image
      Angular
      Angular JS Dashboards
      hopeui
  • Mobile
  • All Items
  • HIRE USNEW
  • Login
  • Sign Up
Forgot Password?
Or Sign In Using
Facebook
Google
Or Sign In Using
Facebook
Google
Lost your password? Please enter your username or email address. You will receive a link to create a new password via email.