Introducing Textpattern navigational tags and how to use `permlink`

This is the beginning of part four of my Textpattern CMS tag guide. The name of the game is navigational tags, and over the course of the next five articles you will learn how to use and build the following tags:

Navigational tags are, as the name implies, largely aimed at assisting website users make their way around. As such, all navigational tags can be used to create hyperlinks that can be clicked or tapped to aid navigation. I’m trying to not use the word ‘navigation’ too many times in a single paragraph, but with the subject matter at hand, it’s pretty important. Ahem.

This article will focus on the use of `permlink`, and the remaining 4 bullets above will have their own explanations in the following articles. The `permlink` tag is one of a select group of tags that can be used as either a single or container tag, so both of these barebones blocks are valid:

<txp:permlink />

<txp:permlink>stuff</txp:permlink>

They differ in function slightly: the single use instance outputs a plain URL to an article, whereas the container version turns it into a hyperlink and uses the inner contents as the thing that can be clicked or tapped. With that in mind, the previous two code blocks will output something like this:

All of these are unset by default. The `class` attribute provides an easy way to set a CSS class to style the output The `id` attribute takes the current article as its target, unless it’s provided with a numerical ID for a different article. Note that some other tags use `id` as a CSS reference, so don’t get confused. The `style` attribute is used to assign inline style to the container text, though from a modern web development perspective it’s generally accepted that using a CSS class and/or a CSS ID is preferable. The `title` attribute is used to populate the HMTL title part of a link, which aids accessibility and search engine visibility.

With all that in mind, some nifty code can be built up with a little bit of work. Let’s start with a basic link:

Hold it right there. This is important. You see that ‘Permanent link to this article’ part? That would be so much cooler if the title referred to the actual title of the article instead of something generic, right? We can do that:

Note that the `title` attribute value is now using different punctuation. This is because of a Textpattern tag inside a Textpattern tag, which is both a) pretty cool and b) the start of a slippery slope to tag nest soup if you’re not careful.

The last thing to mention today is that if you want to add an HTML `rel` attribute, that’s currently not available as a tag attribute. Rather than get mad and bemoan the state of free open source software development, you can just use the single tag version instead and do it another way:

Author Spotlight

Pete Cooper

Pete Cooper has been using Textpattern since 2005. Textpattern is his preferred CMS weapon of choice. Its logical and flexible approach to content management makes Pete happy, as does its lightweight core and helpful user community. Pete's website - petecooper.org - runs on top of Textpattern and chronicles his day-to-day experiences from his home near the Atlantic in north Cornwall, United Kingdom.