Hello friends,

In this post I will present to you one solution that I am certain that you are going to fall in love with. Especially if your website aims to provide detailed graphical information about processes or services or something else.

Presenting: DrawIt – the diagram creation tool for WordPress.

What is DrawIt?

This is a WordPress plugin that you can download, install and activate for free. When you do this your visual and text editors will receive new functions that will allow you to create and insert beautiful diagrams in your posts and pages.

DrawIt utilizes the draw.io website. However (according to the plugin development team) it is not affiliated with them.

This WordPress plugin is an Open Source software.

How to work with DrawIt?

I have already presented the way of getting the plugin up and running on your website. Now you have to adjust some settings which are quite optional, but still – you should check them out.

In order to do this head to the WordPress admin panel. Choose Settings -> DrawIt (draw.io).

From there you can adjust the following:

• Whether or not to create, save and upload SVG images to your WordPress website:
  Here the plugin will warn you that this file format is known for its negative security implications. This is especially true if you allow the upload of SVG files from untrusted sources. So by default this option is disabled. If you want to enable it, DrawIt recommends the installation of another WordPress plugin called Safe SVG. The latter will be able to “sanitize” the SVG files so that you can be sure that they cannot cause security issues with your WordPress website;
• Default image type:
  In case you decide not to enable the usage of SVG files the only default format will be PNG.
• Enable the frontend-based editors;
• Override other plugins disabling the frontend buttons;
• Use insecure version for SVG images:
  This will allow the links in SVG to be clickable, but introduces security holes. That is why it is recommended to leave this option disabled (in case you want to use SVG files in the first place).
• Choose the default temporary directory:
  It can be either the hosting OS temp location or the wp-content/uploads directory of your WordPress website. This folder stores images only during the process of their creation. The final image is moved to your WordPress library and can be accessed by the Media menu;

Now you can go ahead and create your first diagram directly into your WordPress visual editor. Create a new post or a page.

By clicking on the button in the toolbar you will be provided access to a new window which has all the necessary tools for the diagram creation. When you are done with your work simply click on Save and the image will be stored in the WordPress library and automatically inserted into the post or a page that you are creating.

In case you want to insert a previously created diagram you can do this from the Add Media button and proceed like you do with regular images stored in the library. However in the Media Library you will notice a new link that provides access to the diagram editor and you can create a new diagram and insert it automatically when done.

If you are a fan of the WordPress Text editor you can click on the DrawIt button and the editor will show once again.

Simple as that!

So what do you think? Will you use DrawIt for your WordPress websites? Share any thoughts and questions in the comment section below.

See you soon, friends!

*The screenshots in the post are from the WordPress.org page of the plugin.