How to use the Datawrapper oEmbed plugin to easily embed visualizations in your WordPress website

If your website is built with Wordpress, you can install the Datawrapper oEmbed plugin to make embedding visualizations easier. With the oEmbed plugin, you can simply paste the chart URL in your website editor and your interactive & responsive visualization will appear! 

Why use the oEmbed plugin? 

To embed an interactive Datawrapper visualization on any web page, you can copy the embed code and paste it into the HTML source code of the website. However, some CMSs won't let you change the HTML source code. Others strip out the Javascript code responsible for making the charts responsive which causes the charts to get cut off/ appear squashed. 

If you're using WordPress as the CMS of your website, the oEmbed plugin solves all of the above issues! It allows you to embed your visualizations simply by pasting the link to your visualization in the editor. 

How to install the plugin

Datawrapper oEmbed is a free plugin and can be used by all Datawrapper users including free users. To install the plugin, go to Plugins > Add New and search for Datawrapper oEmbed. 

Once installed, don't forget to activate your plugin: 

If you're using Wordpress.com instead of a self-hosted WordPress site, you will have to upgrade to a Business Plan to install plugins. You can read the difference between Wordpress.com and self-hosted WordPress sites on their website here. 

How to embed visualizations with the plugin

Once the plugin is installed, you can go to a published visualization and  copy the link to the visualization. Make sure that the 'Visualization only' is selected: 

Then paste it into the editor on your website. You should see that a preview of the embed immediately appears. 

To see how your article and the chart will look like once it's published, click on  Preview in the top right:

Datawrapper charts are responsive: Try to resize your browser window, and you will see that the charts adapt to the new size and are still beautiful & readable.

Troubleshooting 

Is the embed not working, or is the visualization getting cut off or looking squashed? In that case, make sure that: 

If you're still having issues or have any questions, reach out to support@datawrapper.de.