How to embed charts
Charts can now be used in a new powerful way: they can be embedded into your tiles to share data internally or with the public to close the loop efficiently.
You can now share your charts dynamically with your respondents and let them access a controlled view of the results of your consultation.
Permission level required: Lead admin, Admin
How to embed charts?
Charts can be embedded from your dashboard.
- Logged in as a lead admin or admin, go to your project dashboard.
- After customising the chart to your liking (applying filters, changing the type of chart, pivoting them by another type of data), click on the settings wheel in the top right corner.
- You will now see the chart settings panel, with various options that will affect the content of the iframe that you will embed on your page.
- Include chart title: this will show or hide the chart title
-
Chart title field: if chart title is activated, you can type and customise this title
-
Apply filters: if you have previously selected filters on your dashboard page, you can decide to keep them applied or not. If you didn’t select filters on your dashboard page, changing this setting won’t have any effect.
-
Include background: show the default grey background or remove it to show a white background
-
Include border: show or hide the default border around the chart
-
Include filter summary: if you had selected filters and for transparency, you can choose to display the filters that were selected to produce this chart. This is not turned off if you don't apply filters.
- Include Commonplace logo: hide or show the “Powered by Commonplace” logo.
- Now that your chart is ready, click on "Copy iframe", then "Go to edit mode" if you want to include this chart in a Commonplace page.
- In the new tab that opens the edit mode, select the page where you would like to add this chart from the page dropdown.
- Embedded charts, like any other iframe, can only be pasted in Text and Two column text component.
- Once one of these components is in your page, click the <> icon to open the "html" editor mode
- Paste the code that you had copied from the chart settings page. If you lost it, simply go back to the page and click the button again.
- Once your code pasted, click the <> icon again to exit html mode, then save your changes.
- Your charts are now dynamically integrated to your page!
Useful tips:
- If you don't want your charts to be dynamic (new data will be added to it if your consultation is still ongoing), consider applying a date filter that will set it in time
- You can also add your chart to any other website builder with html editors (Wordrpress, Notion, Webflow...)
- Embedded charts can't be shared via emails, however you can share a link to your report to direct your community to view your results
- Charts are particularly striking when mixed with text, don't hesitate to use the Two column text block to format your report