I need to add a span class in the post title, something like this:

See this picture (a picture is worth a thousand words!).

How to do that? Is this possible?

  • is it always the same content within the span tag? – Michael Nov 3 '12 at 12:50
  • It's more convinient to add custom field right into the theme customization panel with hook: learnwebtutorials.com/… – user3125779 Mar 28 '18 at 7:04

Wouldn't the simplest approach be to use a filter on the_title()?

function add_span($title, $id) {

    return $title .' <span class="title_span">' .get_post_meta($post_id, $key, $single) ."</span>";


add_filter('the_title', 'add_span', 10, 2);

This approach of course assumes you're storing your span data as a meta value.


First of all, the HTML on the image is not valid - close your <span> with </span>.

And yes, it's possible. I would do it with a custom field where you would enter what you want in your <span></span> and then just display it in the theme file wherever you want it.


There are several ways to do this thing.

  1. you can use the append method of jquery.

  2. Other way is to edit the header.php of your theme file and make the changes as required.

  3. follow this tutorial so as to give desired title to each individual post.


You can use custom meta key instead of your title area.

Simple usage : (Replace <?php the_title(); ?> in your theme with this lines)

<?php $html_title = get_post_meta($post->ID, "HTML_title", true); if ($html_title) { ?>               
   <h1><?php echo $html_title; ?></h1>     
   <?php } else { ?>
   <h1><?php the_title(); ?></h1>
<?php } ?>

Type your html codes in your HTML_title meta box than get your magic (:

Happy wordpress.

Not the answer you're looking for? Browse other questions tagged or ask your own question.