Embedding Processing Using WordPress

For my special studies project, I am discussing creating basics on Processing and how the programme can be used to create simple AI’s. I have struggled in finding a way to showcase this, however as some platforms for websites do not accept Java files.

Having traipsed through Google and the Processing websites, I finally found the solution. Whilst it was long winded, the process for embedding a processing document onto a website is as follows:

  1. Convert the code created on Processing to P5 or JS. You can do this online easily.
  2. Create an account with Open Processing, which is also an amazing website to get some processing ideas, as I found out today.
  3. Create a new sketch and paste in everything above. You may need to tweak it a little as it’s a bit more pedantic than normal Processing.
  4. Submit it
  5. View your sketch and in the top left there’s a little share icon (a box with an arrow pointing up)
  6. Copy over the embed code. (It should look like <iframe src=”website html thingy” width=”X” height=”Y”></iframe> )
  7. Paste it into the ‘text’ section of a new post on wordpress
  8. Breathe!

An example of embedding Processing in this manner can be seen below:

Whilst this is long winded for the time being, the process of embedding data like this may become easier as Processing develops and my knowledge gets better in regards to the software. Everyone is a beginner at some point.