Hive Mind

The [Scrippets](http://scrippets.org) [plug-in for WordPress](http://wordpress.org/extend/plugins/wp-scrippets/) seems to be working well for self-hosted blogs, but it’s no use to folks who use services like Blogger, Tumblr and the like. For people on these platforms, the cost of simplicity is customization — they’re easy to use and hard to modify.

But in an effort to share the scrippets love, Nima and I have hacked together a solution to let users on these platforms copy-and-paste scrippets. It’s not as elegant as a plug-in, but it works.

It’s a two-part process.

First, you need to install the [scrippets CSS](http://pastie.org/273557). I wrote up instructions on [how to do it for Blogger](http://scrippets.org/blogger), but the same basic theory should hold for any other blogging or forum system that lets you modify the CSS.

Second, write your scrippet. We have a new [Scrippets Maker](http://scrippets.org/maker.html) that will automatically generate the code to copy-and-paste into your post.

So if you’re feeling brave — or if you want to duplicate your entry in the Scene Challenge on your own blog — give it a shot. You can even add Scrippets Maker to your bookmarks bar. Just drag the following up to your bookmarks:

Do you have a better solution?
===

Currently, Scrippet Maker is a page, but it would make a lot of sense as a bookmarklet. That’s in the works, but if you want to roll your own, by all means do it.

Coders out there might have a slicker overall solution for non-Wordpress users, and I’d love to hear it. Many systems (including Blogger) allow outside JavaScripts, so it may be possible to do text filtering much like the WP plug-in. The core scrippetize function is [already available in JavaScript](http://pastie.org/273604).

Meanwhile, there is the bigger issue of how to handle systems that don’t allow CSS modification at all — and forums that don’t want to deal with it. I’d love to find a way to let users link to a graphic version of a scrippet. (Essentially, click a button and the server converts the div into a jpg or png, and provides a link.)

As always, your brainstorms are welcome. And proof-of-concept links will be most graciously received.

UPDATED. See below.

For the past four years, I’ve been including little blocks of formatted screenplay examples in my posts, such as…

I call these little blocks [scrippets](http://scrippets.org), and they’ve proved to be very useful. They’re made with [some custom CSS code](http://johnaugust.com/archives/2004/screenbox) I wrote in 2004, ((If you look at the example in the original post, it comes from the script for The Nines, which I was writing at the time.)) which several other screenwriting bloggers have implemented with their own tweaks and changes.

If you’re reasonably familiar with HTML and CSS, it’s not hard to do the same: you [paste the CSS](http://pastie.org/257678) into your stylesheet, and mark up your script section with the proper tags. For the example above, the code reads…

<div class="scrippet">
<p class="sceneheader"> INT. LIVING ROOM – DAY</p>
<p class="action"> As the phone RINGS, Gary dozily reaches one dirty-socked foot off the couch to sit up — and suddenly finds himself falling. He lands hard, dazed. We REVEAL that the couch is propped up by cinder blocks, five feet off the floor.</p>
<p class="action"> Gary staggers to his feet, bewildered. Realizing who must be behind the prank…</p>
<p class="character"> GARY</p>
<p class="dialogue"> Grandma!</p>
</div>

Each line is wrapped in a class tag identifying its function, and the whole thing is wrapped in a div. ((As originally implemented, I used an unordered list instead of a div, and styled list items for the individual lines. It was trendy, but two issues made me switch. First, blog comments are also list items, so nesting another list inside kept creating issues. Second, feed readers don’t get any CSS styling — they got a bullet list. So, for now, it’s divs and p’s.)) A human can read it, but it’s a pain to write.

Fortunately, I do all my blog writing in [TextMate](http://macromates.com/), so it was relatively trivial to modify its “Wrap Each Selected Line In…” command to speed the process. For a few years, I just saved the scrippet formatting until last, and it was bearable.

Then, during the strike, I had the time and inclination to find a more elegant solution. I wrote a [script in Ruby](http://pastie.org/257717) that would let me write the above example without any spacing, markup or attempt at formatting, and then with one command wrap it in the proper format. It’s made my blog life a lot easier. But it’s no help to other bloggers who want to include scrippets, or readers who want to post a scrippet in the comments section. It’s too home-brewed and specific.

Ultimately, I’d like every blogger to be able to include scrippets, both in posts and comments. (And forums, though that’s its own beast.) But that’s a hell of a lot of work to support multiple systems and scenarios. So let’s start a little smaller.

Geeks wanted
===

I want to create a WordPress plug-in that would let a blogger or commenter write…

<scrippet>  
MARY
Anything you want to tell me?

FRANK  
I swear, honey, I don't know how mayonnaise got in the piano.  
</scrippet>

…and end up with…

However, that’s simply beyond my coding prowess. WordPress is built around PHP, and while I can understand it well enough to modify a simple template, I fail to grok it the way I do Ruby and Python. But I have a feeling some of my readers could write the PHP equivalent of [my script](http://pastie.org/257717) while half-watching Battlestar Galactica.

If that sounds like you, and you’re up for the challenge, I encourage you to muck around with the code and share your progress. [Wordpress](http://wordpress.org) is trivial to install, with a big developer community. See what you can get working, and include a link to let me and others see your progress.

Here are some caveats, pitfalls and other bits of advice to help you out:

1. Since you’ll be setting hooks to filter the text, you need to play nice with other plugins that do the same, such as [Markdown](http://daringfireball.net/projects/markdown/). Michel Fortin has a [useful post](http://michelf.com/weblog/2005/wordpress-text-flow-vs-markdown/) about some of the challenges in doing Markdown for WordPress. ((And yes, I asked Michel if he wanted to write a scrippet plug-in, but he declined.))
2. While [my script](http://pastie.org/257717) shows the scope of what I’m looking for, Dwayne Bent has already created a [much more sophisticated version](http://liqd.org/wiki/screenplay/main) for DokuWiki in PHP. He’s busy with school, and unfamiliar with WordPress, but offers up his code under the GPL if it’s helpful.
3. <scrippet> may be a terrible delimiter, prone to wonkiness. So other options are welcome. One I’ve considered is +- and -+, which coveys the idea of creating a box around something.
4. The CSS actually does quite a bit of the work. Let your code identify and label the elements, but leave the formatting to the CSS.
5. The plugin should include the CSS — yet make it easy to modify the CSS to suit an individual blog. Specifically, a blogger will want to be able to control the box width, background color, text color and padding. A straightforward admin screen in WordPress seems doable.

I have no timetables or deadlines for the project, but I will offer up a signed Nines poster to a coder who comes up with a viable and elegant version of the plug-in — and of course, heaps of praise and bragging rights.

And if WordPress isn’t your bag, but you feel the calling to take on a similar version for another platform (Movable Type, bbPress, vBulletin), by all means go for it. If this comment thread gets out of control, I’ll move it to a different forum.

**UPDATE:** Just over 24 hours in, there’s been a lot of progress. Thanks to everyone who’s given a chunk of their weekend to the cause.

By Monday or Tuesday, I’ll be posting a link to a test blog where readers can try out the plug-in for themselves. Before releasing it into the wild, we want to make sure it works with a range of stock themes and feels intuitive to readers leaving comments.