draw.io diagrams can be neatly and easily embedded as an SVG in a WordPress blog post, and any links within the diagram will function perfectly in the blog post. SVG diagrams load very quickly, when compared to other methods.
You can also embed diagrams as pure images, which may be slow to load, but are downloadable, not dependent on installed fonts, and can use text formatting and word wrap; or as HTML, which retains formatting, layers and links, but increases the loading time.
When embedding a diagram as an SVG, you simply need to disable text formatting and word wrap on all labels first. This removes the formatting on the individual text components. Instead, it uses one format for the label.
Step 1: Disable text formatting and word wrap
Make sure you have the Text tab of the panel on the right displayed.
- Select all the elements of your diagram (right click, Select All), and uncheck the Formatted Text box.
- Select all the vertices in your diagram (right click, Select Vertices), and uncheck the Word Wrap box.
Step 2: Embed the draw.io diagram in a WordPress blog post
- In draw.io, select File→Embed→SVG.
- In the dialog that is displayed, uncheck the Lightbox box, then click Copy.
- Edit your Wordpress blog post in text mode, and paste your diagram.
Your blog post is now ready to be published!