How to make category tabs in wordpress.com
One design feature that many WordPress blogs have and that no TypePad blog has is page tabs. You have probably seen them on many wordpress.com blogs, and you can see them on this blog too: The tabs “Home”, “About”, “Contact” and “Scoreboard” are pointing to pages. But did you know that you can make them point to categories instead?
WordPress versus Typepad
You can make pages in TypePad, but no page tabs; in TypePad you only have a Pages widget, much like in WordPress, albeit with much less functionality, as I described in this post: WordPress beats TypePad (again): Pages.
Page tabs are URL tabs
Page tabs are much more than just page tabs. A page tab appears as soon as you write a page and publish it: The page title becomes the page tab title. But did you know that you can make the page tab point to any URL on your blog? This way you can make it point to categories and list all posts within a certain category by clicking the “page” tab. Actually, you can make the page tab point to a certain post, if you want it to.
How to make the page tab point to a URL
The trick is to enter the URL in the page title, just like you write a link using HTML:
<a href="URL">TWO WORDS</a>
Remember that you must use at least two words to designate the URL, otherwise this will not work. The URL for the category you want to point to is like this:
http://USERNAME.wordpress.com/category/CATEGORYNAME/
or if you want to point to a tag:
http://USERNAME.wordpress.com/tag/TAGNAME/
So, if I want to point to a category in my blog, I could write this:
Limitations and uses
Obviously, this little trick has it’s limitations. You must use at least two words for the link and if you have many categories or tags, you cannot do this for all. On the other hand, this can be a nifty little trick for promoting certain categories or tags that otherwise may get lost in the “clutter” on your blog, or you could use to promote “This week’s topic” (category or tag) or similar. In any case, it can make your blog a more fun place to be.
Happy blogging!
Related
WordPress beats TypePad (again): Pages.
Hi wpvstp! First, I think you should caution that the trick doesn’t work well with some themes (e.g. Digg 3). Second, we’ve got news: http://en.forums.wordpress.com/topic/not-possible-to-edit-html?replies=6#post-248541
You are correct. It does not work so well in the Digg theme, and there could be others, too. I haven’t checked them all, so bottom line: no guarantee that this will work across themes.
One question. Whether it will work on other hosting (distinct from wordpress.com)?
@jordano
No, I don’t think it will work, and besides, I’m really not in a position to tell, since I do not have an extra self-hosted blog with WordPress theme on it. But if you do make it work, please let me know. Thanks.
on ac3bf1.org (my blog)
works with one word also :-)
Just though I’d let you know :-)
This makes two tabs for me, one that doesn’t have any text and another one that works. Very bizzare….
Wow. great trick. I had been looking for an answer to this problem all night. Thanks for the simple solution!
Two things
1. I have a one word page title, but adding my category URL as my page title makes the tab very wide
2. WHenever I click on the page title it includes the entire URL in the address bar; which means that the website url is listed twice
Doing this creates invalid HTML which will cause different browsers to react differently. What it’s doing is inserting a link element where WP prints out the text of your page’s title. So instead of printing this to the page (html changed so not to screw up this page)
Page Title
WordPress will print:
Page Title
Which is bad juju on many levels. That explains the multiple tabs in one case, it not showing up in others – not to mention it’ll throw off your code if you’re depending on a strict doctype.
Unfortunately, I haven’t figured out a better way to do it at this time. If I do, I’ll be back.
Apparently my code still got messed up… try this… pretend the (‘s are <‘s and so on…
Instead of
(a href=”oldURL”)Page Title(/a)
WordPress is printing
(a href=”oldURL”)(a href=”newUrl”)Page Title(/a)(/a)
Which is bad juju… cuz you’re not supposed to nest anchor elements, blah blah blah
Anyone figure out how to eliminate the phantom page tabs that occur when you try this?
I haven’t been able to get this to work. Does anyone know of another way to manually choose the link a page should go to?
This worked for me and was the perfect fix. I’m also not hosted on wordpress.com.
I have another theme that didn’t work. just like Chris Wible said. it nested the links. Any solution.
Thanks for the trick dude.. you rock!