Embedding a project is a great way to share interactive, visual content with your audience. Not only will they be more likely to engage with your content, but also spend more time on your website.
Each project has an individually generated embed code.
To access a project’s embed code:
❶ Open your project editor and click the Share button in the top right corner of the screen, or simply click the icon at the bottom right side of the project thumbnail in your Infogram Library.
❷ Open the Embed section to access Responsive (Async), Responsive, Fixed, and WordPress embed codes.
Embed code options:
- Responsive (Async): The embedded project will adjust to its container and will adapt to the screen size your project is viewed on. This is an optimized responsive embed code version.
- Responsive: The embedded project will adjust to its container and will adapt to the screen size your project is viewed on.
- Fixed: The embed size will be fixed. Note that your project size may vary across platforms. With this code, the embed size will not adapt to its container.
- AMP: Use this code to embed on AMP (Accelerated Mobile pages) pages. For more steps, check out the article about Embedding on AMP pages.
- WordPress: To be able to embed into Wordpress, you will be required to download a plugin. You can get the plugin here.
❸ Copy one of the provided codes and paste it into the text editor of your CMS, or any other interface that allows you to write HTML.
Tip: Be careful not to paste it in the visual view or the actual code will show in your article. Always paste the code into the Text or HTML view.
Note: Sites like Tumblr and Squarespace remove script tags. You will have to use the fixed embed code that places the content in an iframe.