super-cooper

First off, I have to say that I can really only take credit for about 10% of the code in this plugin, if that. I really can’t even take credit for the idea. And let me also come out and say that I am in no way any sort of PHP genius. I’m sure there are things that could be done better in this plugin, but this works for me. So, with all that out of the way, the idea for this came from Dunstan, and the majority of the code came from Aaron Schaefer’s Code Viewer plugin.

What is it, and why?

Conversation Viewer is a WordPress 1.2 2.5 plugin that pulls a external text file into a post and formats it into a defined list, keeping you from having to manually code the conversation into a defined list, ordered list, or Heaven forbid, a ghastly table. I wanted to be able to easily and quickly include conversations into posts, while still keeping the code nice and clean. I tried this manually once with a table, and while the result looked good, the code was rather sloppy and very cumbersome to compose.

How it works

Basically, you tell the plugin the path to your conversation text files, and to insert a conversation, you simply call the text file(s) containing the conversation(s), and it (they) will appear in the post. You can call as many different conversations in one post as you want, just name them uniquely. The nitty gritty of how the plugin works is commented in the plugin code.

Usage

You need three things to get this up and running: the plugin, a text file of a conversation (with proper syntax), and some CSS for styling. Get the plugin here. Change $default_conv_path to the absolute path of the directory you plan on storing your text files of conversations (mine is something like http://www.super-cooper.com/conversations/), then slap it into your plugins folder and activate it. Next, construct your conversation file, which should look something like this:

1. Me,Why did the chicken cross the road?
2. The Wife,Why?.
3. Me,To get to the other side.
4. The Wife,You're crazy.
5. Download this code: conversation-viewer-example-1.txt

Now let’s break this down. This is a conversation between the Wife and I where I am showing off my joke-telling prowess, and she is obviously very impressed. There a basically two parts to the conversation: who’s talking and what they are saying, which are separated by a comma. The plugin looks for the occurence of the first comma, assumes everything to the left of it is the person, and everything to the right of it is what that person is saying. Call the text file in your post like so:

<conversation src="http://www.super-cooper.com/snippets/conversation-viewer-example-1.txt" />

I like to arrange mine in subdirectories by date, and if you have more than one to include in a post, just add the numbers on the end and call them accordingly. Note that this path is relative, you set the root of this path in $default_conv_path in the plugin earlier. The above text conversation, parsed through the browser, would look like so with the plugin and my CSS:

Me:

Why did the chicken cross the road?

The Wife:

Why?.

Me:

To get to the other side.

The Wife:

You’re crazy.

And the code that produced it would look like so:

1. <dl class="conversation">
2. <dt>Me:</dt>
3. <dd>Why did the chicken cross the road?</dd>
4. <dt>The Wife:</dt>
5. <dd>Why?.</dd>
6. <dt>Me:</dt>
7. <dd>To get to the other side.</dd>
8. <dt>The Wife:</dt>
9. <dd>You&#8217;re crazy.</dd>
10. </dl>

The definition term is the person’s name, and what they said is the definition.

Mixing it up

Let’s say you want to emphasize what someone is saying. I like to do this with italics. Well, to style what the person is saying in italics, simply add a pound sign (#) before the person’s name, like so:

1. The Son,I'm having a horndog for dinner.
2. #Me,Really?
3. The Son,U-huh.
4. Me,Don't you mean a corndog?
5. The Son,That's what I said, a corndog.

Which, when called through the plugin and parsed, would look like this:

The Son:

I’m having a horndog for dinner.

Me:

Really?

The Son:

U-huh.

Me:

Don’t you mean a corndog?

The Son:

That’s what I said, a corndog.

And the code that produced it would look like this:

1. <dl class="conversation">
2. <dt>The Son:</dt>
3. <dd>I&#8217;m having a horndog for dinner.</dd>
4. <dt>Me:</dt>
5. <dd class="emphasis">Really?</dd>
6. <dt>The Son:</dt>
7. <dd>U-huh.</dd>
8. <dt>Me:</dt>
9. <dd>Don&#8217;t you mean a corndog?</dd>
10. <dt>The Son:</dt>
11. <dd>That&#8217;s what I said, a corndog.</dd>
12. </dl>

Finally, here’s my CSS that I use for styling my conversations:

1. dl.conversation dt {
2. clear:left;
3. float:left;
4. text-align:right;
5. width:9em;
6. line-height:1.8em;
7. font-weight:bold;
8. }
9. dl.conversation dd {
10. margin:0 7px 0 10em;
11. padding:0;
12. vertical-align:top;
13. line-height:1.8em;
14. }
15. dl dd.emphasis {
16. font-style:italic;
17. }
18. Download this code: conversation-viewer-example-css.txt

Some other examples of this plugin in use can be found here and here.

Other stuff

This plugin was designed for WP 1.2 (yeah, I know I should migrate to 1.5, but I don’t have the time or desire to do so anytime soon), so I have no idea if it will work in 1.5. If it does or doesn’t, please let me know. EDIT: This works in 2.5 as of 2008-04-22. Also works on 2.7 as of 2009-01-02 Any feedback is appreciated, but remember, most of the code I just hacked up from Code Viewer.