capitalize page titles in WordPress
(without using a Plugin)
While working on a custom WordPress theme for a client this morning, I came across a peculiar problem. The words I was using for custom tags and categories which (in this particular theme design) get displayed in the page’s <title> in breadcrumb-like fashion, were being displayed just as they were typed in – with all lower-case characters. After doing some Google searching, I discovered there was no documented easy solution to capitalizing these text values. I found that there were many Plugins available that do this, but I really felt like installing a Plugin just to get some words capitalized seemed like overkill. Eventually, by using some of the code I found in those plugins, I hand-rolled the simple solution I was looking for, and thought I’d share it with y’all here…
First, let me explain that I did not have an issue with getting some things capitalized, like category name, for instance. To do that i simply used the PHP string function, ucwords() inline like so…
<title>Site Name - <?php echo ucwords($category); ?></title>
The problem I was having was with the WordPress template tags: wp_title and the_title. You can’t use ucwords() directly on these because they’re not a string. So, the solution I came up with was to write a small PHP function at the top of my “header.php” file that takes the text values from wp_title and the_title, turns them into a string, and applies capitalization with the ucwords() function…
<?php
function captitle($title) {
$title = ucwords($title);
return $title;
}
add_filter('wp_title', 'captitle');
add_filter('the_title', 'captitle');
?>
enjoy.
comments
7 Responses to “capitalize page titles in WordPress”
Leave a Reply
-
need my help?
Interested in having me be a consultant on your next project? to email me.
-
what i’m reading...
where did you enter the code
Site Name –
In the header.php” file as well or somewhere else?
Hi Jen,
I’m not sure i understand the question…
The values for the <title> of the page are already automatically generated by WordPress, including the site name – this little bit of code I’m presenting here just shows how to get WordPress to capitalize the words in that string.
Thank you SO much for this tip! I’ve been driving myself crazy trying to figure out why my tags always revert to lower-case, thus causing lower-case HTML titles on tag pages. I implemented this on the Thesis theme by entering the code (without the starting/ending php tags) into the custom_functions.php file. Worked perfectly – you’re the best! =)
i still didn’t get it…
do i have to put all the code in my header.php for
Site Name –
OR
do i have to put some of the function to my function.php :
and this to my header.php
Site Name –
Correct me if im wrong..
Hi Max,
you just need to copy that last 8-line block of code and paste it at the top of your header.php file.
that’s all there is to it.
also – read my response to Jen’s question above, as it is similar to your’s…
Great fix, it works but I found a CSS solution text-transform http://www.w3schools.com/css/pr_text_text-transform.asp
Hi Thomas,
I approved your comment for others to see – but I would also like to point out that this solution doesn’t work in all browsers.
I tried the solution you’ve mentioned here first, and decided against it after doing my cross-browser / cross-platform testing and found that not all browsers allow CSS styles to affect the <title> element.
which browsers fail? – I honestly don’t remember – it’s been a while since the day i made that discovery – (most likely IE)