Support Centre

Search

Embedding in Websites, Emails or Blogs

Patrick Gabriel
Patrick Gabriel
  • Updated

Available on the following Venngage subscription plans: Premium, Business and Enterprise.

Open the design you want to embed in the Venngage Editor. Finalize the design so that it looks exactly how you'd like it to, before you share.

Select Share from the menu above the design canvas (top right) when you're ready to grab your embed code.

In the Venngage Editor, a user has selected the Share button in the top menu, and the Share modal (box) has opened. The user clicks the third of three tabs at the top of the modal: Share, Download, and Embed.

 

Customize your embed options. Toggle "Border" to add a border around the design (make some additional spacing around the design itself) or "Footer" to add some space underneath the design. Toggle "Responsive" to allow the page displaying your design make changes to how it's sized and displayed, relative to the device or settings in the browser it's being viewed on.

With the Share modal (box) open and displaying over the design canvas, the user toggles options under the Customize your embed options heading (on the Embed tab). The user toggles Footer on, Border on, then off, and then toggles Response off. In a code box under the heading Embed code, the code is automatically updated according to which toggles are on or off.

 

Click or select Copy at the bottom of the modal (box) when you're ready to copy the embed code. This will automatically copy the code displayed under "Embed Code" to your device clipboard.

An infographic canvas is open in the Venngage Editor, with the Share modal (box) open and displaying over the design canvas. The Share modal has three tabs: Share, Download and Embed. The Embed tab is selected. Under the heading Customize your embed options, the user has turned the toggle next to Footer on, and the toggles next to Border and Responsive off. Under the heading Embed Code, a text field displays the HMTL code for the user to copy the embed according to the options they selected. The user clicks copy and a small widget pops up at the bottom of the modal confirming the code in the Embed Code text field has been copied successfully.

 

Add the embed code to your blog, webpage or email.

 

Show me how: Adding custom HMTL to a Wordpress blog post

Here's an example of what you can do with embed code from your Venngage design.

Create a new post on your Wordpress blog.

Add a custom HTML widget to the post.

Paste the Embed Code you copied from the Venngage Editor directly into the Wordpress post.

Click "Preview" to see how the infographic will display in the post once it's published.

 

In a window open to a new post in Wordpress, a user types My Infographic in the post title field. The user clicks the plus icon to add a new block to the Wordpress post, and scrolls down the available options until they click Custom HTML under the Widgets heading. An HTML block appears in the Wordpress post; the user pastes the embed code from the Venngage editor and uses the top navigation controls above the code block to switch to Preview, which then displays the Venngage Infographic design in the body of the Wordpress post.

 

Curious about upgrading? Compare our plan features side by side.

Was this article helpful?

0 out of 1 found this helpful

Have more questions? Submit a request