Transcripts

The vast majority of webcomics are image files, that you've painstakingly created in Photoshop, the GIMP, or something similar. Humans can read the dialogue in your strip, but machines can't. What if you want readers to be able to search for a particular strip by a piece of dialogue?

stripShow allows you to add transcripts to every post which expose the content of your post to the world of search engines. These transcripts do not appear when viewing the post by default (but can be made to, using template tags), but are part of the post for purposes of searching. You can, for example, search for a character's name or piece of dialog using WordPress's built-in search engine (or, if you've enabled notification in WordPress, external blog search engines like Technorati.

Adding Transcripts to Posts
To add a transcript to your blog post, simply type whatever text you normally would into the blog entry, then add your transcript in the following format:

Transcript Markup
Hey, how's it going? Hey, what's up? Bob hauls off and decks Jim. I just made this tag up. It's just that easy! What tags exist in this exciting new markup language? Well, anything you want, really. As you can see, the character tag has a parameter -- the character's name, which comes after the equals sign.

Using Transcript Tags
In your template, you insert a transcript through the use of template tags. The conditional tag has_transcript can be used to ensure that the transcript toggler is only shown if the post itself has a transcript. Transcript tags should only be used inside WordPress's loop.

Transcript PHP
&lt;?php if(has_transcript) { transcript_toggler; the_transcript; } 	?&gt; This code consists of three parts:

This conditional tag tells stripShow only to display any of the following if there actually is a transcript for this post.

This code generates a link that, when clicked, shows or hides the transcript code. By default, the transcript starts out hidden. See.

This code generates the transcript itself, as an HTML table. See.

Transcript Output
The code in would produce the following HTML:

Transcript HTML Output
&lt;table cellpadding="0" cellspacing="0" border="0" class="transcript" id="transcript_comic-for-january-4-2009" style="display:none;"&gt; &lt;tr class="transcript_line"&gt; &lt;td class="transcript_character"&gt;Bob&lt;/td&gt; &lt;td class="transcript_dialogue"&gt;Hey, how's it going?&lt;/td&gt; &lt;/tr&gt; &lt;tr class="transcript_line"&gt; &lt;td class="transcript_character"&gt;Jim&lt;/td&gt; &lt;td class="transcript_dialogue"&gt;Hey, what's up?&lt;/td&gt; &lt;/tr&gt; &lt;tr class="transcript_line"&gt; &lt;td colspan="2" class="transcript_description"&gt;Bob hauls off and decks Jim.&lt;/td&gt; &lt;/tr&gt; &lt;tr class="transcript_line"&gt; &lt;td colspan="2" class="transcript_arbitrary"&gt;I just made this tag up. It's just that easy!&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; By default, the transcript is displayed as an HTML table.

The entire table is given the CSS class transcript

The transcript for each post is given a unique CSS ID in the form transcript_&lt;post slug&gt;.

Each line in the transcript is given the CSS class transcript_line.

Most rows in a transcript table have two columns: one for the character name, the other for the dialogue. These are given CSS classes of transcript_character and transcript_dialogue, respectively.

A line of description contains only one column, which is given the CSS class transcript_description.

If you've put a self-created tag in your transcript markup, this is treated just like description, with one column per row, and given a class name transcript_&lt;tag name&gt;. This allows you to create multiple custom tags and style them all differently.

As you can see, the output is an HTML table. This is the default behavior, but using arguments to the the_transcript template tag, you can change this to use divs and spans instead. See for details. The same CSS classes are used when the transcript is shown as a div.