Safe Title: a WordPress plugin

Thursday, 23 June 2005

Latest version is 0.1.

Safe Title is a WordPress plugin that allows you to use HTML in post titles in the default WordPress theme.

Warning: You probably don’t need to use this plugin. It’s more an interesting technical experiment than a useful addition to the WordPress canon. Please read the notes below.

When posting to your WordPress blog, sometimes you just want to use HTML in the title. You want to make some words stand out with color, or use italics or a code font. (Here’s an example of an HTML post title on this very website.)

Sadly, the default theme included with WordPress 1.5 can’t handle this; it fails to strip HTML tags from the title when it appears inside an HTML attribute, and you end up with a deformed post title. I initially solved this problem by creating a special template tag that strips tags from the title, but this meant I had to edit my theme to use the new tag. Wouldn’t it be nicer to create a plugin that would do it automatically, thus magically “fixing” the default theme?

I amused myself by finding a way to do it. It’s easy to add a filter to the_title to strip the tags. The hard part is when the filter has to decide whether to actually strip the tags or not. It only needs to do it if it’s being used inside an HTML attribute, but the filter callback does not receive any context to help it decide.

So we create some context for it. Turn on output buffering at the top of the page (using an action hook). Then the filter can look at the output buffer to see whether it’s being used inside an attribute. The rest is simple.

The beauty of this idea is that it’s completely automatic — just enable the plugin. No theme changes required.

The ugliness of this idea is that it’s probably terribly inefficient and may break other plugins that mess around with output buffering. But I find the “sledgehammer vs. peanut” approach quite amusing.

And it’s a great illustration of how flexible WordPress is.

Compatibility

Safe Titla was developed with WordPress 1.5, but is not robust due to problems with the WordPress hooks.

Installation

  1. Download the safe-title.php file (see the end of this article for download location)
  2. Copy safe-title.php into your WordPress plugins directory (wp-content/plugins).
  3. Log in to WordPress Admin. Go to the Plugins page and click Activate for Safe Title
  4. That’s all

Here’s the code from the plugin:

// Turn on output buffering 
add_action('wp_head', 'tguy_st_ob_start');

// Strip the title if it's inside a tag
add_filter('the_title', 'tguy_st_strip_if_in_tag', 10, 3);

function tguy_st_ob_start() {
    ob_start();
}

function tguy_st_strip_if_in_tag($title_wrapped, $before, $after) {
/*	Strip HTML tags from the title if it's already inside a tag.
*/
    $title = substr($title_wrapped, strlen($before), strlen($title_wrapped) - strlen($before) - strlen($after));
    $title_stripped = strip_tags($title);
    if ($title != $title_stripped) {
        // Title has html tags
        if (preg_match('/<[^>]*$/', ob_get_contents())) {
            // We're inside a tag. Return the stripped title
            return $before . $title_stripped . $after;
        }
    }
    return $title_wrapped;
}

I’d love to hear any comments on this approach. The idea of peeking into the output buffer is overkill for this plugin, but it could be a useful way of solving more complex problems.

Download

You can download safe-title.php or view the source code. Don’t forget to check out all the other plugins available here — there’s bound to be one that you will find useful.

I write these WordPress plugins because I enjoy doing it, but it does take up a lot of my time. If you think this plugin is useful, please consider donating some appropriate amount.

Click here to donate using a credit card or PayPal.

Send Bitcoins to address
1542gqyprvQd7gwvtZZ4x25cPeGWVKg45x

Full WordPress plugin list

  • Code Markup — Quickly paste code samples into your posts -- you can even include HTML markup in the code sample.
  • Evermore — Automatically display a short preview of your posts on the home page and other multiple-post pages, along with a link to the full post.
  • FixBack — Ensure trackbacks and pingbacks are sent with the correct link back to your blog.
  • Less — Less is no more. It has been renamed to Seemore and moved to its own Seemore plugin page.
  • Plaintext — Allow your readers to download source files (e.g. PHP, HTML, ASP) as plain text.
  • Safe Title — Use HTML in post titles in the default WordPress theme (or any other theme).
  • Search Meter — Find out what people are searching for on your blog, so you can write what your visitors want to read.
  • Seemore — Change the (more...) link so it jumps to the full post, not just the part after the link.
  • Top Cat — Specify a main category for your posts, and use template tags to display posts differently according to their main category.

14 comments

You can leave a comment, or trackback from your own site.

  1. Unfortunately, Safe Title seems to break Miniposts: http://doocy.net/mini-posts

    🙁

  2. As I mentioned, Safe Title is not robust at all, partly because of problems with WordPress itself. (And see the warning at the top of the page!) Sorry it’s not compatible with Miniposts. Unfortunately, I don’t really have the time available to investigate.

  3. it is genius though! it saves me for using complicated plugins when adding pictures in the titles… but .. yes… it is not completely stabel. When clicking on the phermalink the page is empty…. but still.. thanks!

  4. Hi

    Need your help.

    My log:
    [11:07:39] PHP Warning: Missing argument 3 for tguy_st_strip_if_in_tag() in /var/www/vhosts/xxxx.info/httpdocs/wp-content/plugins/safe-title.php on line 53

    What does it mean and how to fix it?

    thx

  5. Hi Bennett,

    One of the trackbacks to this article says we don’t need Safe Title *anymore*. Do you know if the WordPress core or any other plugins now enable HTML in titles?

    Also, how can I arrange the layout of my title so multiple-word names or two-word terms aren’t split across two lines? I tried /n (for new line) but as you said, that code is displayed.

    Thanks,
    Jonathon

  6. @Jonathon, I don’t know if WP core has been fixed to support HTML in titles yet. If it does get fixed then you’ll be able to embed <br /> in your post title to force a newline. I don’t know of any simple way to stop a title from being split.

  7. Is there a way to use a clickable banner in place of a page title?

  8. @Ian, you could edit your theme to add the clickable title if you wanted it to appear on every post. To have it appear as the title, you could use Safe Title and set the title to something like this:
    <a href="something.html"><img src="banner.jpg" alt="" /></a>

  9. Regarding using br’s in wordpress page titles, it works on 2.9.1, but one side effect is that when you hover over any page links, the html code is showed on the popup (a:link title attribute) for that link.

  10. Yes, that can be a problem depending on the theme. It’s always fixable by changing the theme. Safe Title is an attempt to fix some of these problems automatically, but of course it can’t fix everything!

Leave a comment