Adding Custom Title Tags for WordPress Posts Using Custom Fields

The standard wordpress title tags generated using the wp_title() function returns the post title (article heading) as the title tag for single posts. This is good for the most part, but there are times when you might want to add custom title tags for some of your posts and use the standard title tags for the rest. You can make use of the wordpress custom fields to achieve this without using a plugin. Let's see how.

Here are the steps involved:

  • Create a custom field in your wordpress dashboard to add your custom title tag to.
  • Add a function that checks if this custom field is present and returns it, or in its absence returns the single post title.

Let's look at these steps in detail:

1.) Creating the Custom Field

The first step is to create the custom field in your wordpress admin panel. As mentioned above, in the absence of this custom field, the standard single post title will be returned.

Here are the steps to create a title tag custom field:

Step 1: Login to your wordpress dashboard and open the post you want to add a custom title tag for.

Step 2: Scroll to the end of the post and you should see the Add a New Custom Field section. (If you don't find the 'Add New Custom Field', click on Screen Options (Location: Top Right hand corner of your dashboard) and enable Custom Fields by ticking the checkbox.)

Step 3: In the custom fields section click on Enter new and in the Name field, enter the word title (all lower caps) and in the Value field, enter your custom title tag.

Note: you need not keep creating the 'title' custom field for all posts. Once you do this for one post, the title custom field is automatically saved. The the remaining articles, you can select the title field from the drop down menu.

The function that we are about to add next will check if this custom value is present and output this as title tag. If this value is not present, it will output the single post title as the title tag.

2.) Adding the Function

The next step of-course is the add the function to your functions.php file. You can do this from within your wordpress admin panel as follows:

Step 1: Login to your wordpress dashboard/administration and from the left sidebar, select Appearance > Editor and click on the functions.php (Theme Functions) link.

Step 2: Add the following code in it and click on 'Update File'.

/*Function to add custom title tag*/
function custom_title_filter($title,$sep){
if( is_single() ){
$sitename = get_bloginfo('name');
#custom value is present.
	if(count(get_post_custom_values("title")) >= 1){
		$title_values = get_post_custom_values("title"); # Get custom value.
		$title = "$title_values[0] $sep $sitename"; 
		return esc_html($title);
#custom value is not present. Return single post title.
return $title;	
add_filter('wp_title', 'custom_title_filter', 10, 2);

Code Explanation: The function makes changes to the single post title tags by adding a filter to the wordpress wp_title function.

We first check to see if a custom field is present using the get_post_custom_values() function. This function returns the requested custom field in an array. If the array is empty the post does not have a custom value and hence the standard single post title tags will be returned.

On the other hand, if the array contains elements then the custom field is present. We know that the key/name for this custom field is title (all lower case) as that's the word we used in the name field while creating the custom field. We now use the get_post_custom_values('title') to get the value contained in the title key and save the returned array in the variable $title_values.

WordPress saves the value of the key in the zeroth (0) index, so in other words, the value is stored in $title_values[0] which we return after appending the $sep and $sitename to it. $sep is the separator which is most cases is the pipe (|) and the $sitename contains the site name. The resultant title will look as follows:

Custom Title Tag | Sitename

If you do not want the sitename to appear at the end, you can remove the $sep and $sitename from the following line in the code:

$custom_title = "$title_values[0] $sep $sitename";

Note: For a slightly more in depth tutorial on adding custom fields, refer my article on adding custom meta descriptions.

Note: Once you have added this code, make sure to check pages of your site to make sure the title tags are being generated properly.

3.) Monitoring Your Blog's Title Tags

A simple way to monitor your title tags is using Google Webmaster Tools. Here's how:

Step 1: Login to your Google Webmaster Tools.

Step 2: Select your website to monitor.

Step 3: From the 'Site Dashboard' menu in the left panel select, 'Search Appearance' > 'HTML Improvements'.

Step 4: See if you have any issues listed there under the 'Title Tag' section. If not you are good to go.

Generally the kind of issues you might find listed in the title tag section are, title tags are too short, there are duplicates and pages with title tags missing and these can be easily rectified by making changes to the respective post's title.

Related Articles



  1. Julie says:

    Clearly written & well constructed article!

    How do I achieve this when my theme has declared add_theme_support for title tags?

    • M Mukesh says:

      Julie, it's not possible to use this when the theme has title tags activated. The only way would be to deactivate the title tags and then add a function to create title tags for all the different pages. I will try and write an article with the required code soon.

Leave a Reply

Your email address will not be published. Required fields are marked *