Joel Vandal

Ok, I’m new to WordPress and need to display diagram directly on my posts. Unfortunately, I haven’t found any plugin that allow me to draw simple diagram.

I’ve made some search and discover websequencediagrams.com that has developed a unique service for generating sequence diagrams based off an intuitive text language. The basic service is free to use, images are watermarked with the company logo at the bottom.

Since no plugins exist for WSD, I decide to write my own (and first) plugin for WordPress. Until approved and added in the official list of WordPress plugins, you can install the plugin manually using :

cd wp-content/plugins/
wget http://joel.vandal.ca/download/wsd.zip
unzip wsd.zip

Once installed and plugin activated through the ‘Plugins’ menu in WordPress, you will be able to add very simple or advanced diagrams in your post, by sample, the following text  :

User->Service: Search(topic, query)
Service->Repository: Content Cached?
Repository-->Service: Yes (Cache Results) / No
opt Content Not Cached
    Topic->ContentProvider: Search(query)
    ContentProvider-->Service: Search Results
    Service->Repository: Cache Results (topic, query)
end
Service->User: Search Results

results in the following image:

User->Service: Search(topic, query)
Service->Repository: Content Cached?
Repository-->Service: Yes (Cache Results) / No
opt Content Not Cached
    Service->ContentProvider: Search(query)
    ContentProvider-->Service: Search Results
    Service->Repository: Cache Results (topic, query)
end
Service->User: Search Results

There are a number of output formats including the following:

• Plain UML
• Rose
• QSD
• Napkin (what’s shown in this post)
• VS2010
• MScGen
• OmegApple
• Blue Modern
• Green Earth
• Round Green