Processing JS WordPress Plugin

Include Processing JS sketches into your WordPress blog posts.

Download — Latest Version


The easiest way to install the plugin is to install with plugin installer (enter your WordPress address).

If you want to do it manually:

  1. Upload the processingjs directory to the /wp-content/plugins/ directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress

Once activated, you’ll notice a ‘processing’ button when you’re writing or editing a post in HTML mode. Clicking it will insert a very simple Processing sketch into your post. You can use it as a template or write your own from scratch. You’ll find examples (with code) of what can be done here: Processing JS Demos.


Processing JS button in HTML mode



If you find this piece of code useful, please consider donating. I work on these projects in my spare time. My site carries no advertising and I release most of the code I work on under a free software license. Your contribution (whatever the amount) would be greatly appreciated.


  1. Posted 3 April 2013 at 2:27 am | Permalink


    Great small plugin, it will be useful for me as I am writing some image processing tutorials using Processing.js, on my WP blog.

    I currently have blog pages and processing.js sketches pages, now I can combine both.

    I had an issue when trying your plugin, because I was testing in “preview” mode. The fix was simply to reload the preview (FYI, I am using Chrome 26.0.1410.43 on MacOS 10.7.5).

  2. Posted 15 April 2013 at 1:12 pm | Permalink

    Hi Gael, glad you found it useful. And thanks for the report about preview mode not displaying your sketch. I’ve noticed this too. I think the reason is due to a security feature built into Chrome. See

    I’ll have to see what I can do to prevent this. As you say, reloading the page after hitting preview should work.

  3. David
    Posted 4 November 2013 at 1:48 am | Permalink

    I’m having trouble using images. I’ve written a little program with a one-line setup that calls size(), and a tiny draw that clears the background and draws a rectangle. That works fine. If I then put a @pjs directive at the top to pre-load an image (e.g., /* @pjs preload=”picture.jpg”; */), then suddenly there’s no canvas, no graphics, nothing except the HTML that was around my code. I’ve tried variations on the path ranging from absolute pathnames starting with http: all the way down to the purely local path as above. I’ve tried putting my pictures in wp-content/uploads and into a separate folder at the top of the WordPress installation. Nothing works. I’ve not been able to find a single example where this is done successfully in WordPress. Any advice would be greatly appreciated! I’m using Processing.js 1.4.1 and WordPress 3.7.1.

  4. Milena
    Posted 4 December 2013 at 12:53 am | Permalink

    Omg thank you so much for this programm! I wasn’t able to get the processing code via html into my web and it’s a college project.
    You’re a savior! Imma donnate when I can 🙂

  5. Malcolm Brooks
    Posted 12 November 2014 at 9:46 pm | Permalink

    Keyvan… Greetings from Maine, USA. Thanks so much for your plugin ….Malcolm Brooks

2 Trackbacks

  1. […] I used the Processing JS plugin, written by Keyvan Minoukadeh. You can get it from this location : […]

  2. […] vous souhaitez afficher vos sketch un peu partout je vous recommande d’utiliser le plugin processing JS qui installe la librairie processing.js pour vous et vous donne acces a un shorcode dans vos page […]

Post a Comment

Your email is never published nor shared. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Subscribe without commenting