Such links are most commonly used for jumping from a table of contents to the beginning of a chapter or section (as in Wikipedia).
To do this, you need two pieces of code (in the html editor, of course): one at the source point and one at the destination point.
• If the destination point is on the same post or page, the code model is:
Source (= link proper)
<a href="#UniqueName">LINK TEXT HERE</a>
Destination
<a id="UniqueName"></a>
Where I’ve written UniqueName you can write anything – just make sure it’s exactly the same in that source/destination pair (including capitalization), and it’s unique to that pair (for another link like that, you’ll need a different UniqueName).
For example, your table of contents might be:
<a href="#intr">Introduction</a>
<a href="#ch1">Chapter One</a>
etc. etc.
Then right before each section title you would write:
<a id="intr"></a>
<a id="ch1"></a>
etc. etc.
(You can also use a source/destination pair to link back from the end of each section to the table of contents, but this is superfluous if the table of contents is at or near the beginning of the page: readers can use the back-to-top keyboard arrow.)
• If the destination point is on another post or page, then the link proper must include the URL of that post or page:
<a href="URL HERE#UniqueName">LINK TEXT HERE</a>
For a live example, click the links in my left sidebar under “Lists of Posts”.
To make the links open in a new browser window or tab, you need to turn the beginning of the link proper to this:
<a target="_blank" [etc.]
• To style the link proper in a way other than the default of the theme you’re using, you need this beginning (see my posts on formatting text):
<a style="PROPERTIES AND VALUES HERE" [etc.]
• You can also add back-to-top links at the end of each chapter or section:
<a href="#top">Back to top</a>
But they aren’t really necessary, since one can use the back-to-top arrow of the keyboard.
https://wpbtips.wordpress.com/
Thanks a thousand from “my fellow the biologist” (naturaxiz.wp.com) for this tip!
… and many others, of course.
Posted by K. Gregorovius | August 23, 2010, 02:25@KG: You’re welcome!
There’s also a Support doc on this ( http://en.support.wordpress.com/splitting-content/page-jumps/ ), but I think it’s not as clear as mine, and it doesn’t include how to link to a point on a different page.
Posted by Panos | August 23, 2010, 18:18Completely new to HTML. Thanks for explaining so clearly how to make the Page Jumps work. Now I feel a whole lot better about posting a new (and very long!) history page on my blog … coming soon!
Posted by Scott | August 27, 2010, 18:21@Scott: You’re welcome – and welcome to HTML!
My posts on formatting text might also prove of use to you (see my left sidebar).
Posted by Panos | August 27, 2010, 18:54Yes! Those posts are most helpful. Thanks for pointing them out. I have been wondering how to do hanging indents for a bibliography. Your instructions worked perfectly. Now, let’s see if I can properly add spacing between lines…
Posted by Scott | August 27, 2010, 23:56Seems to be what I need, thanks!
Posted by Lichanos | June 17, 2011, 20:47Thanks. I’ve been searching about this for hours. I didn’t know what it’s called (I thought it’s called “page map”), but it’s a happy accident that I got here.
Posted by AJ Luna | December 16, 2011, 20:05You’re welcome. WP calls them “page jumps”.
Posted by Panos | December 17, 2011, 00:47I’m curious. Is it possible in wordpress.com to expand/collapse a text (that looks like a link) when it’s clicked? If so, how?
Posted by AJ Luna | December 17, 2011, 01:25No. It would require javascript, which we’re not allowed to use.
Posted by Panos | December 17, 2011, 02:04@ AJ LUNA,
Cursor help is code you can use to “expand” (further define) some text:
<span style="cursor:help;" title="DESCRIPTION_HERE">NAME_ON_A_LIST</span>
(Hi Panos… just wanted to make a suggestion)
Posted by Tess | December 17, 2011, 17:43@Tess, that’s not what I’m looking for, but thanks for the tip. It just might be a good alternative. :)
Posted by AJ Luna | December 18, 2011, 03:35@ AJ LUNA,
No, I didn’t think that was what you wanted, but it is the only code we can use on wp.com—it’s quite undramatic and you can’t add images or links, but…
Posted by Tess | December 18, 2011, 04:31Thank you!! I’ve been wanting to do this. It worked great–both linking from another post and fr within the same post.
A question:
If there are 2 points in a post where I want a link, both to the same part further down in the post, do I make 2 separate pairs with different unique names, and just line the 2 destination codes next to each other?
Same question for if I have points on 2 different pages that I want to link to the same point on another post?
If I have a lot of source links all to the same destination link and all need their own “unique name” pair, there would sure be a lot of destination codes lined up in front of that one destination!
Posted by ingridcc | December 19, 2011, 06:25No. You need a different unique name for each different destination. So if you link to the same destination, you use the exact same code in all those other points that should link to that destination.
Posted by Panos | December 19, 2011, 06:32Thanks for that lightning-fast answer, I’m heading over to my blog to apply it right now!
Posted by ingridcc | December 19, 2011, 07:04Another question, on making the link open in a separate window:
You said “To make the links open in a new browser window or tab, you need to turn the beginning of the link proper to this:”
Do I substitute the code you show : [greater-than symbol] a target=”_blank” [etc.]
for some part of the previous code, or do I append it in front??
Sorry for being so dense!
Posted by ingridcc | December 19, 2011, 07:24Nevermind! I figured it out by comparing to the html of a link I had already set to open on a separate window, should have done that before asking…Thanks again for all this great info, some of my blog posts are so overly-long, this will really help readers skip down to the part they want without having to scroll and hunt…
Posted by ingridcc | December 19, 2011, 07:50As you can see I don’t always give lightning-fast answers: I just happened to be using my computer for my blog when you posted the previous question.
For the answer you no longer need I would have used the same strategy – for instance direct you to this post:
https://wpbtips.wordpress.com/2009/04/01/codes-useful-for-text-widgets/
As for long posts, this might also be of interest to you:
http://en.support.wordpress.com/splitting-content/nextpage/
Posted by Panos | December 19, 2011, 11:04nice done
Posted by profesorenglezaa | February 15, 2012, 00:32Hi Panos,
Thank you so much for all useful knowledge.
Posted by southpacificengagement | March 12, 2012, 20:32