---
title: "How to Embed Charts on Your Website"
date: 2026-04-23
author: "GravityKit"
link: "https://www.gravitykit.com/docs/gravitycharts/how-to-embed-charts-on-your-website/"
---

There are three different ways to embed a chart on your website with GravityCharts:

- By using a shortcode: [The  Shortcode](https://www.gravitykit.com/docs/gravitycharts/gravitycharts-shortcode/);
- By embedding an image of the chart: [Image charts for GravityCharts](https://www.gravitykit.com/docs/gravitycharts/image-charts/);
- By using the GravityCharts block. **See below for more information**.

### Embedding a Chart on a page/post using the GravityCharts block

 After creating a new chart, you can embed it on your website using the GravityCharts block. Here’s how to do it.

 Edit your page and click on the ‘+’ icon in the WordPress block editor. Now search for “GravityCharts” and add the GravityCharts block to your page.

![Add a GravityCharts block by selecting the plus icon and typing "gravitycharts"](https://www.gravitykit.com/wp-content/uploads/2025/10/file-q7luqefBSn.png)
*Next, click on the block to open the block settings in the right-hand panel. Now select your form and feed from the dropdown menus*![Form and feed dropdowns with a link to edit chart settings](https://www.gravitykit.com/wp-content/uploads/2025/10/file-1SKUoPsz5T.png)
*After that, you’ll see a preview of your chart load inside the editor*![Bar chart displaying city survey data with options for form and chart type selection](https://www.gravitykit.com/wp-content/uploads/2025/10/file-6yX5e8fVLV-scaled.png)
*If you only want to chart data from a single entry, enter the entry ID under the "Advanced" tab*![Entry ID field highlighted in chart embedding settings, with optional value 123](https://www.gravitykit.com/wp-content/uploads/2025/10/file-BvtkaCL21F.png)
*When you’re done, update your page*