Someday you’re going to write a really long piece. It’s going to be filled with all kinds of helpful information, which readers will appreciate, especially if they can get to the information quickly. It’s a busy world. People don’t want to have to read through reams of text to get the answer to a question. Fortunately, WordPress gifts us with the ‘more tag,’ which once inserted into your post, cuts the content at that point, and continues it on another page. There’s also the ‘next page tag’ for pages. An example of that in action can be seen in my WordPress tut on this site. However, while you’re checking that out, did you notice that I have an index of sorts, where you can click a topic and go straight to the section that had the information? Well, that’s done with the old tried and true anchor tag. The anchor tag allows you to link one part of your content to another part – simply. Here’s the code:
<p> <a href="#C4">See also Chapter 4</a> </p> <h2><a name="C4">Chapter 4</a></h2> <p>This chapter explains ba bla bla</p>
Notice the first line after the ‘p’ tag? This line says, there’s a chapter four. If you click it (not here, not now), your page will zip down to Chapter 4. That’s done with the line of code beginning with ‘a name. So in the first line, you assigned whatever you wanted to name chapter 4, which here is #C4, and then you placed that with ‘a name.’ You can do that any number of times on a page/post. The code goes into the HTML editor of your post/page edit screen. If you want the anchor link to skip to another page, just include, at the very least, the relative url for that other page. A relative url is shorter, refers to the site itself; it doesn’t include the whole url address. For example:
<a href="/2010/05/the-most-popular-blog-platform/3/#wp2">
If you want a link to return your reader to the top, use the anchor link like so (notice it just goes in reverse):
<a name="top"></a> <a href="#top">Table of Contents</a>
Place the -a name=”top” -at the top of your page. Place the -a href=”#top”- at the bottom of your page.
Voila! You’re linking baby!
The above code creates anchor links on a page or post. Later, I will provide the php function for placing the ‘return-to-top’ anchor site wide.