bradchoate.com

MT-Macro to the rescue! Actually, the technique described here utilizes 3 of my Movable Type plugins. All functioning in perfect harmony.

Here's how the opening paragraph looks as I typed it:

<leadin>Lead-ins are an eye-catching
mechanism</leadin> usually found in
print publications. Recreating that effect for
the web is easy to do, but it could be easier.
Wouldn't it be nice if there were a 'leadin'
tag that you could use to identify the word
or phrase you want to style like that?
Well...

Here's what it produces after my 'leadin' macro is done with it:

<span class="leadinDropCap">L</span><span
class="leadinPhrase">ead-ins
are an eye-catching
mechanism</span> usually found in
print publications. Recreating that effect for
the web is easy to do, but it could be easier.
Wouldn't it be nice if there were a 'leadin'
tag that you could use to identify the word
or phrase you want to style like that?
Well...

...Now, I know-- that's not doing all that much you say. But... it does handle punctuation properly (at least to my tastes). Opening punctuation such as quotes, dashes, periods, etc. are also made part of the 'dropcap' part. Also, the macro will utilize an images you might have created for your letters. It does this by checking for an '/images/(style)/(letter).gif' file underneath your blog's output directory. The 'style' part defaults to 'a'. If you have multiple styles, just specify the style attribute for the leadin tag. For example:

<leadin style="b">This demonstrates</leadin> style B.

With that leadin tag, the macro will look for /images/b/t.gif (or /images/b/t.jpg). If it finds it, that graphic will be used in place of the letter 'T'. If the graphic can't be found, 'T' will be used instead.

The following steps will walk you through setting this up for your blog.

Step 1: Install MT-Macro, MT-EmbedImage and MT-PerlScript.

Step 2: Alter your styles-site.css template (or whatever file has your CSS stylesheet rules). Add the following to it (feel free to customize the styling once you see how they're used):

.leadinDropCap {
  float: left;
  font-size: 400%;
  line-height: 100%;
  font-weight: bold;
  font-family: Impact, "Arial Black", Arial, sans-serif;
}
.leadinPhrase {
  text-transform:uppercase;
  font-weight: bold;
}

Step 3: Create a new template module named "macros" and add this to it:

<MTMacroDefine ctag="leadin" script="PerlScript">
  $first = q{<MTMacroContent remove_html="1">};
  $match =
    qr/^\s*                # ignore leading whitespace
      (                    # select any symbol prefix:
        (?:\&[a-z]+\;) |   # named html entities
        (?:\&\#[0-9]+\;) | # numeric html entities
        (?:[^A-Za-z0-9]+)? # non alpha-numerics
      )
      ([A-Za-z0-9])        # select first alpha-numeric
    /x;

  ($sym, $firstchar) = $first =~ $match;
  $rest = $MTMacroContent;
  $rest =~ s/$sym$firstchar//s;
  $style = $MTMacroAttr{style} || 'a';
  print q{<span class="leadinDropCap">};
  print $sym if $sym;
  if ($style) {
    $lcfirst = lc($firstchar);
    print compile(q{<M}.
      qq{TEmbedImage basename="images/$style/$lcfirst"
      default="$firstchar"><img align="top"
      src="<MTBlogURL><M}.
      q{TEmbedImageFilename>" height="<M}.
      q{TEmbedImageHeight>" width="<M}.
      qq{TEmbedImageWidth>"
        alt="$firstchar" border="0" /></M}.
      q{TEmbedImage>});
  } else {
    print $firstchar;
  }
  print qq{</span><span
    class="leadinPhrase">$rest</span>};
</MTMacroDefine>

Step 4: Change your index and archive templates to use the above template module. Wherever you output entries that use the macro, the macro definition has to be loaded so it can process your data. Add this to the top of the templates:

<MTInclude module="macros">

You'll also need to add an "apply_macros='1'" attribute to any MT element that outputs the 'leadin' macro. For example, change your <MTEntryBody> tag to look like this:

<$MTEntryBody apply_macros="1"$>

That's it. If all went well, you can now use a the <leadin> custom tag to markup your entries.