---
title: "How to Create a Bar Graph in Elementor?"
url: https://theplusaddons.com/docs/bar-graph-in-elementor/
date: 2024-02-05
modified: 2026-09-27
lang: en
author: "Aditya Sharma"
description: "Bar graphs are a popular, effective way to present data - simple, visually clear and easy for readers to understand at a glance. This doc covers the Bar chart type..."
image: https://theplusaddons.com/wp-content/uploads/2024/02/How-to-Create-a-Bar-Graph-in-Elementor_-1024x536.jpg
word_count: 223
---

# How to Create a Bar Graph in Elementor?

## 

- The Plus Addons for Elementor Pro requires Elementor (free) installed and active, and the Chart widget exists only in the paid version, not in the free plugin.
- Chart widget settings use Chart Type set to Custom, Select Chart set to Bar, and Orientation set to Vertical Bar or Horizontal Bar.
- Chart widget renders a real interactive Chart.js bar chart on the front end, with axis labels and bars visible and correctly proportioned to the entered data.

Bar graphs are a popular, effective way to present data - simple, visually clear and easy for readers to understand at a glance.

This doc covers the Bar chart type specifically - see the Settings Overview for every other option.

For the full settings tour of the **Chart** widget, see [Chart Widget: Settings Overview](https://theplusaddons.com/docs/chart-widget-settings-overview/).

***Requirement - This widget is a part of The Plus Addons for Elementor Pro, make sure it's installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/advanced-charts/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Prerequisite:** [Elementor](https://wordpress.org/plugins/elementor/) (free) installed and active.- **Edition:** Chart is a **Pro** widget - it requires the paid version of The Plus Addons for Elementor. It does not exist in the free plugin.- **Widget to enable:** go to **The Plus Addons > Widgets**, search for **Chart** and turn its toggle on.

## Steps

- Add the **Chart** widget to the page, leave **Chart Type** as **Custom**.- From **Select Chart**, choose **Bar**.- From **Orientation**, choose **Vertical Bar** or **Horizontal Bar**.- In **Label Value**, add labels separated by `|`, for example `Jan | Feb | Mar`.- In the **Dataset** tab, add your data values.

![Orientation control set to Vertical Bar](https://theplusaddons.com/wp-content/uploads/2026/09/chart-bar-orientation.webp)

## How It Behaves

Confirmed on the front end: the widget genuinely renders a real interactive Chart.js bar chart, with the axis labels and bars visible and correctly proportioned to the data entered.

## Related Docs

- [Chart Widget: Settings Overview](https://theplusaddons.com/docs/chart-widget-settings-overview/)- [How to Create a Bubble Chart in Elementor?](https://theplusaddons.com/docs/bubble-chart-in-elementor/)

## Frequently Asked Questions

**Q: What do I need before creating a bar graph in Elementor?**
A: Elementor free has to be installed and active, and the Chart widget is a Pro widget in The Plus Addons for Elementor. That matters because the bar graph feature is not part of the free plugin. The setup also depends on enabling the widget under The Plus Addons > Widgets by searching for Chart and turning its toggle on. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH provides the Chart widget inside the Elementor editor.

**Q: Why is the bar chart widget not showing up in Elementor?**
A: The usual blocker is that the Chart widget has not been enabled in The Plus Addons > Widgets, or the paid version of The Plus Addons for Elementor is not installed and activated. This chart feature is a Pro widget, so it does not exist in the free plugin. If the widget is missing, that points to setup status rather than a chart-setting problem. The page also notes that Elementor free must be active first.

**Q: Can I make a vertical or horizontal bar graph in Elementor?**
A: The Chart widget supports both Vertical Bar and Horizontal Bar through the Orientation setting. That gives you two common presentation styles without changing tools. Vertical bars are usually better when you want a quick read of category-to-value comparisons, while horizontal bars can help when labels need more room. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH offers this inside its Chart widget.

**Q: How do I enter labels and data for a bar graph in Elementor?**
A: Labels go into Label Value as text separated by pipes, like Jan | Feb | Mar, and the numbers go into the Dataset tab. That split matters because labels define what readers see on the axis while the dataset controls bar height or length. If those two parts do not line up cleanly, the chart becomes hard to read even if it still renders. This setup keeps the data entry simple inside Elementor.

**Q: What happens after I build a bar graph with The Plus Addons for Elementor?**
A: The front end renders a real interactive Chart.js bar chart with axis labels and bars that match the data you entered. That means it is not just a static image or decorative block. The page specifically confirms that the bars are correctly proportioned to the entered values, which is important if you are using charts to compare numbers at a glance.

**Q: Where can I find more settings for the chart widget?**
A: The bar graph tutorial only covers the Bar chart type, so other options live in [Chart Widget: Settings Overview](https://theplusaddons.com/docs/chart-widget-settings-overview/). That separation matters because it keeps this guide focused on one chart type instead of mixing every possible setting into one page. For another related chart example, there is also [How to Create a Bubble Chart in Elementor?](https://theplusaddons.com/docs/bubble-chart-in-elementor/).