Ready for a surprise?
The title of this post contains two links. The link on the first part of the text is to the post itself; this is quite normal. However, there’s a second link at the end, on the bracketed text, that should take you to the ‘caveats’ section below. (I’m assuming that you’re reading this in a standard web browser, not in the WordPress Reader.)
Let’s start with the caveats
- Things change. This works today; it may not work tomorrow.
- I’m referring here to WordPress.com posts/ pages created in the ‘block editor’.
- Some of this is theme-dependent; I’ve tested on Twenty Ten, Reddle & Colinear.
- How the link is rendered will be device/ browser/ theme dependent.
- I’ve not found a way to reliably highlight such links: they may be mystery links.
- If the default link on a title is to the post itself, overriding that may cause confusion.
- You may want to check the slug before publication to ensure it’s human-readable.
How to embed links in (WordPress.com) post titles
The title of a web page is, technically speaking, no different from the rest of the page. It’s marked up using HTML. Currently, at least, it’s possible to embed hypertext anchors within the title simply by typing in the necessary code directly into the title in the editor.
What I actually entered as the title of this post was:
Yes, it IS possible to embed hyperlinks in titles! <a title="This link is to the caveats!" href="https://pendantry.wordpress.com/2021/08/24/yes-it-is-possible-to-embed-hyperlinks-in-titles-but-there-are-caveats#caveats">(but there are caveats)</a>
If you don’t know the code to create an HTML anchor element (‘<a> tag’) — which defines a hyperlink — I explain that in my post ‘How to embed links in WordPress comments‘ (or you could visit the relevant W3Schools tutorial page, which has the advantage of a ‘try it yourself’ interactive widget).
Curiously, in the three WordPress.com themes on which I’ve tested this (Twenty Ten, Reddle and Colinear), as far as I can tell, the editor removes any and all HTML (and inline CSS) except anchor elements. It won’t even allow the humble underline element (<u>), which was the first thing I tried to use to draw attention to the existence of an unexpected link in the title. The anchor’s title attribute is allowed (on all three of those themes I tested), but that’s of minimal use as it’s still necessary to hover over the text to get it to pop up, so such links remain mystery ones.
(For more on the title attribute in anchors, see my post ‘How to add mouseover tooltips to links in WordPress‘.)
In some themes, WordPress automatically creates a default link on the title to the post’s permalink (in some situations). Embedding an anchor within the title terminates that default link; the remainder of the title text will in that situation be rendered with no link at all. So (if you’re using one of those themes), if you add a link to the interior of the title, it’s probably best to insert a link to the permalink to the remainder of the title as well; alternatively, if you just want to add a single link, you can avoid this extra hurdle if you put the link at the end of the title.
You can embed several links (I’ve tried it with three): there is a limit, which is probably the maximum length of the title. I’ve done some testing that indicated that a title can contain up to (a bizarrely huge!) 64k characters, so this shouldn’t be an issue.
The background: what made me think of this
During a recent trip into the blogosphere via ?RandomRaiders!, I visited a post from last year on Goldie’s site. It’s labelled (in the post’s title) as an ‘HW’ post. Now, I try hard to avoid jargon (and abbreviations, unless they’re well-known) wherever possible, because I believe that clarity beats brevity, and jargon tends to hinder, rather than aid, communication. But I’m well aware that some people love the stuff. It seems to be a part of human nature to abbreviate even when doing so might obfuscate; I suspect there may be a cognitive bias that applies§. But I digress.
Goldie uses a variety of abbreviations on his site, applying these as prefix labels to his post titles. His intent is to assist his audience, and that’s admirable; personally, I find them confusing, and wonder why he doesn’t simply use categories — but I don’t mean to cast aspersions on my friend, it’s his site and he can do with it as he wishes. And, as always, it’s quite possible that I’m the one who’s wrong here; perhaps his other visitors find his abbreviations helpful.
So, anyway: I landed on that post of Goldie’s, and its title is prefixed with ‘HW’; and I suddenly thought how useful it would be to be able to click on the unfamiliar (to me) abbreviation in the title itself to find out what ‘HW’ means. (It stands for ‘Hashtag Week’, which is just as inscrutable to me, and perhaps explains my inability to remember it when I see it, unlike, say ‘CW’, which is ‘Creative Writing’.)
The title of Goldie’s post I refer to above is ‘HW: Monday Motivation; Chase Your Dreams!‘
In some WordPress themes (such as Twenty Ten, which I’ve used here on ‘Wibble’ since day one, as well as the theme Goldie currently uses on his site), the title is rendered by default as a link to the post’s permalink (in some situations). In such cases, WordPress automatically employs the following code (in the background, hidden from the user):
<a href="https://dailyflabbergast.wordpress.com/2020/07/27/hw-monday-motivation-chase-your-dreams/">HW: Monday Motivation; Chase Your Dreams!</a>
If Goldie wants to retain the ‘HW’ abbreviation as a prefix, then there’s a problem, because inserting a link terminates the default anchor (as I explained above), and the remainder of the title will just be text with no link.
<a href="https://dailyflabbergast.wordpress.com/2019/08/31/nrop-cw-bt-hw-what-do-those-mean/">HW: </a>Monday Motivation; Chase Your Dreams!
One way round this would be to manually add the permalink back in again for the rest of the title. However, this is more work (especially as it would be necessary to ensure that the correct permalink is used each time — and that, of course, changes with every post):
<a href="https://dailyflabbergast.wordpress.com/2019/08/31/nrop-cw-bt-hw-what-do-those-mean/">HW: </a><a href="https://dailyflabbergast.wordpress.com/2020/07/27/hw-monday-motivation-chase-your-dreams/">Monday Motivation; Chase Your Dreams!</a>
An alternative would be to put the abbreviation at the end of the post title instead of at the beginning, relying on the default behaviour of WordPress to provide the first link. That way, Goldie would only have to add the link to the abbreviation at the end (and that’s much easier because it’s the same address for every post):
Monday Motivation; Chase Your Dreams!<a href="https://dailyflabbergast.wordpress.com/2019/08/31/nrop-cw-bt-hw-what-do-those-mean/"> :HW</a>
This would have the added benefit of visitors being able to identify from then on whether the post title had the ‘link-in-title’ feature, or not. If the abbreviation is at the beginning, it’s an older post, and there’s no link; if it’s at the end, then it’s one of the ‘enhanced’ ones. (And, assuming that Goldie were to run with this idea, he could perhaps consider amending his original ‘what do those mean?’ post to explain the difference.)
What are ‘mystery links’?
I have long used the term ‘mystery link’ to refer to links that are effectively hidden (to most users) on a web page — ever since I recognised, many years ago, that these were an irritant. In the vast majority of cases, there is very little point in embedding, within a web page, navigation that is effectively invisible, and can only be found (by most users) by waving the mouse around in the hope of finding something that may (or may not) be there. As respected HCI expert Jakob Nielsen says, “Users […] like websites that support the goals of their visit” — and hiding links from the user fiercely hinders this. According to Nielsen:
Textual links should be colored and underlined to achieve the best perceived affordance of clickability, though there are a few exceptions to these guidelines.Guidelines for Visualizing Links, Jakob Nielsen (2004)
Although I do consider myself an expert in HCI, I am far from being a well-known one (and I am a long, long way from being ‘respected’, though that’s another story). Nevertheless, it came as quite a surprise that when I searched for the term ‘mystery link’ just today, expecting to be able to link to a relevant, informative page somewhere on the web, I was unable to find one; hence this explanation.
Is this a deliberate feature… or an overlooked flaw?
While creating this post, it occurred to me that this feature could be exploited by the unscrupulous to trap the unwary. Knowing that the default behaviour of post titles in some WordPress sites is to link to the current post, and that users, being familiar with that behaviour, might be less likely to check where the link goes before following it, this technique could be used nefariously to hijack traffic. (I’m willing to bet that the scammers I referred to in my post last week would love such a bait-and-switch tactic!)
Given that that’s a possibility, I think it’s quite likely that WordPress may make a change to prohibit manual addition of links to titles in the future. (I really don’t understand why it is that anchors are, currently, allowed, whereas other code is not.) See my very first caveat, at the top of this post: Things change.
A note on internal links
Just in case you’re unfamiliar with links to content within pages, which I’ve used in this post several times; this is, again, standard HTML. WordPress refers to the technique as ‘page jumping‘ (which I actually think is a misnomer, as it suggests jumping between pages rather than within them). Unfortunately, these seem somewhat erratic; sometimes such links ‘jump’ to the correct block; other times, they jump to the block below the named one. I haven’t got to the bottom of that particular conundrum yet; it may be another example of the current bugginess of the ‘Gutenberg’ block editor and/or the WordPress environment (although I have seen this behaviour on other platforms in the past).
§ I’ve been through Wikipedia’s extensive list of cognitive biases and haven’t been able to find an appropriate bias label; the nearest approximation is the ‘mere-exposure effect‘, but that’s not quite what I mean. I’m referring to (what appears to me, at least, to be) the tendency to overestimate others’ knowledge of something based upon one’s own familiarity with it.