With our premium Chart widget, you can place a variety of charts on your page. You can import the data from a CSV file, a URL or add it manually, but only if the imported structure matches the selected chart type.
Here's everything you need to know about this widget.
Add a Chart widget
Instructions
Click the Add icon in the top right corner (+ icon).
Click to Browse all widgets.
Locate the option Chart. Click it.
Click Add widget.
You'll see a Chart widget with dummy data on your page.
Edit data
To personalize your Chart widget, click the More button in the top-right corner of the widget. Then click Edit data.
These are your options:
Import data
Manually enter data into the columns and rows. Alternatively, you can also paste columns and rows you've copied from a spreadsheet.
Import data. The Chart widget doesn't automatically categorize columns or rows in a CSV file. Please make sure it fits the following format:
StructureHeader row — first row is treated as headers (column names). Required by default.
Column 1 — category labels (X-axis). Text values: dates, months, names, etc.
Columns 2–9 — numeric value series (Y-axis data). Up to 8 series max.
Max 9 columns total (1 category + 8 value series). Extra columns are silently dropped.
Max 1500 rows (1 header + 1499 data rows). Rows beyond that are silently dropped.
Form
Separators: comma
,, tab, or semicolon;— auto-detected, tried in that order.Quoting: double-quote
"for fields containing separators or newlines. Escaped quotes via"".Line endings: CRLF, CR, or LF all accepted (normalized to LF).
Encoding: UTF-8.
File extension:
.csvor.txtaccepted by the file picker.
Value parsingNumbers: plain digits with optional decimal point and commas (e.g.
1234,12.5,1,234.56— though note commas are ambiguous with comma-separated format).Hex:
0x1Aetc.Empty cells →
undefined(skipped in calculations).true/false→ boolean.null→ null,NaN→ NaN.Everything else stays as a string (fine for the category column, but won't chart as a value).
Example valid CSV
1. Month,Revenue,Profit
2. Jan,12000,3200
3. Feb,15000,4100
4. Mar,13500,3800
For the Map chart, there are additional criteria to display correctly:Country names in English (e.g., Belgium, Australia, United States) - or:
A 2-letter country code (according to ISO 3166-1 alpha 2).
Connect live data. This should be a publicly accessible CSV file, for example, a Google Sheets document.
Make sure to publish your sheet in the Comma Separated Value format.
Use double quotes (") if you want to display values with commas or other special characters.
The first line contains column headers.
The first column contains labels.
The following columns (max. 3) contain numeric data values.
Widget menu
Right-click the widget or click the More icon (three dots) to open the Widget menu. This is where you control the appearance and behavior of your Chart widget.
These are your options
Refresh the widget, to make sure the data is current. This is especially useful when connecting live data.
Edit data: see above.
Customize chart. Select the type of chart that best matches your data:
Area chart: shows up to 3 series in an overlapping (non-stacked) area chart.
Line chart: shows up to 3 series as lines.
Bar chart: shows up to 3 series as horizontal bars.
Column chart: shows up to 3 series as vertical bars.
Pie chart: shows one data series as a pie chart.
Doughnut chart: shows one data series as a doughnut chart.
Map chart: shows one data series as a map overlay, showing values per country.
Height: choose between small, medium, large, or extra-large.
Legend position. Place the legend below or above the chart, or omit it entirely.
Rename widget.
Change background color and transparency. If you make the widget 100% transparent, you'll only see its content. You can also apply this setting to all other widgets on your page.
Copy the widget to another page. The original widget will remain on the page.
Move the widget to another page. The original widget will be deleted.
Share the widget. Once you tick this option, you can share the widget with a unique link. In this window you'll also see if you've made a live copy of your widget.
Delete widget. You'll get a pop-up to confirm. If you continue, the widget will be deleted. There is no way to undo this.
Resources
The Chart widget can use a public CSV file as a data source, provided the data structure matches the selected chart type. For more information about the Google Sheets procedure, check their support section. You could also consult this blog post.
You'll find the introductory article for this widget on our blog.