<!-- thumbnail: http://www.bolsterweb.com/wp-content/uploads/2011/02/stackapps-stackfiddle-thumb.png -->
<!-- version: 1.0.5 -->
<!-- tag: chrome-extensions -->
<!-- excerpt: Stack Fiddle makes sending code from SO to jsFiddle easy. It adds headers to the code blocks on Stack Overflow (and other Stack Exchange sites) for you to choose and send straight to jsFiddle. -->

##Screenshot

<img src="http://www.bolsterweb.com/wp-content/uploads/2011/02/doc-21.png" />

##About

Stack Fiddle is a Google Chrome extension that updates the code blocks on Stack Exchange sites. Each code block gets a header with links that allow you to set its type. Click the code type (HTML / JavaScript / CSS) of the blocks you want to include and then press the 'Send to jsFiddle' link. All the code blocks you selected get sent to jsFiddle and you're ready to go!

This is for people, like myself, who answer JavaScript questions on Stack Overflow. Most of the time, users will post their HTML, CSS and JavaScript in separate code blocks but you  still have to copy/paste them individually into jsFiddle and choose your favourite framework. This extension makes it a little bit quicker and easier.

Not every code block will be given the header. This is only applied if the question has a tag that's in the specified tag list (customisable in the options but by default it has a few JavaScript related tags). You can also set your default framework so that it's already set for you in each new fiddle.

###License

The code is hosted on a [github project page][1] under the [Creative Commons Attribution-ShareAlike 2.5][2] license.

###Download

It's available for free download at the [Google Chrome Extensions gallery](https://chrome.google.com/extensions/detail/loemajeogfdlphofpdfncpbbeoenmbpm).

###Platform

Google Chrome

##Contact

The developer of this extension is me, [Jonathon Bolster][3]. You can get in touch with me about the project via any of the following:

 - My Blog: http://www.bolsterweb.com
 - Github Project: https://github.com/jbolster/Stack-Fiddle
 - Twitter (@jbolster): http://twitter.com/jbolster
 - Email: jonathon -at- bolsterweb -dot- com

##Code

Plain old JavaScript, HTML and CSS were used - along with the very awesome jQuery library. Another plugin used is [jquery-tags-input][4], which gives a nice way to change the active tags. Options are saved using localStorage. Everything is then posted off to the [jsFiddle API][5].

The code can be downloaded on the [github project][6]. Issues can be raised there (or by contacting me at the links above) and I'm open to any suggestions if anyone has any ideas :)

---

In case I've missed anything off from above, these are the blog posts I used to describe Stack Fiddle in the first place:

 - [I made a Google Chrome Extension - Stack Fiddle][7]
 - [Stack Fiddle - Now up on github][8]


  [1]: https://github.com/jbolster/Stack-Fiddle
  [2]: http://creativecommons.org/licenses/by-sa/2.5/
  [3]: http://stackoverflow.com/users/261677/jonathon-bolster
  [4]: http://xoxco.com/clickable/jquery-tags-input
  [5]: http://doc.jsfiddle.net/api/index.html
  [6]: https://github.com/jbolster/Stack-Fiddle
  [7]: http://www.bolsterweb.com/2011/02/i-made-a-google-chrome-extension-stack-fiddle/
  [8]: http://www.bolsterweb.com/2011/02/stack-fiddle-now-up-on-github/