Adding HTML to Video Excerpts with PrettyPhoto/Wordpress 3.5.1/Watercolor theme

A friend called me up wanting some help with his Wordpress site.  He is using the Watercolor theme and he's using the prettyPhoto jQuery plugin.  The problem was that prettyPhoto pulls the description on its modal pop-up box from the 'title' attribute of the attribute it was applied on. That would normally be fine except for in this case we wanted the description to have HTML tags (specifically, anchor tags to make some links).  There are two problems here:

1. Wordpress strips out the HTML from the 'excerpt' field
2. If the HTML stays in there, it shows up when the user hovers over the element

First, let's let HTML stay in the excerpt field through a simple Advanced Excerpt plugin.

The solution for the second piece involves the modification of two files: video-gallery.php and the jquery.prettyPhoto.js file.

video-gallery.php

Change this in your Wordpress Watercolor's installation:

<a href="<?php echo $videoURL ?>" rel="prettyPhoto" title="<?php the_excerpt() ?>">

To this:

<a href="<?php echo $videoURL ?>" rel="prettyPhoto" title="<?php the_title() ?>" data-title="<?php the_excerpt() ?>">

This sets the title attribute (what pops up in that yellow box) to the title of the video, and then gives a new attribute, data-title, the HTML-filled description.

jquery.prettyPhoto.js

Search for attr('title').  There should be three matches.  Change each 'title' to 'data-title'.  Then, reupload the file.  This tells prettyPhoto to load the description from the 'data-title' tag and not just from the 'title' tag.