Content Anchor Links

This plugin makes it easy to add content anchor links (or “jump links”) to your posts and pages.

A “content anchor link” is a link that goes to a specific location in the content (theĀ “anchor”) An anchor is created by adding a unique “id” attribute to a heading in the content. Normally, these are a bit tricky to add, you need to get into the HTML because the WordPress editor doesn’t have a way to add ID attributes to headings. Also, once you have your IDs placed, there isn’t any convenient way to create a link to that heading.

This plugin solves both of those issues by automatically adding a unique ID to the content headings, and then adding those anchor points to the list of linkable content in the “add link” pop up (the linker). With that set up, it’s now very easy to add content links to your pages and posts.

A Tutorial

A content anchor link list is something like what you see at the top of this page. If you have a page with lots of information on it, it can be a good idea to give the reader a quick way to jump to various sections of the page. This also serves to give the reader a quick overview of what’s on the page and how it’s organized.

  1. Organize your page content into logical sections using headings. You’re probably already doing that. This is a good idea for several reasons, including helping the reader understand the material, improving search Ā engine indexing, and helping the reader find a specific section.
  2. Once you have all the major headers in place (usually, you will use Heading 2 and Heading 3 for this) Ā save the page (as a draft or published) and all the heading anchors will be set.
  3. At the top of your page, place a bullet list with all the major sections of the page.
  4. To place the anchor link, select the text of one of the bullets, then click on the “add link” icon.
  5. The linker will pop up and if you begin to type the first few letters of the heading, some suggestions will appear. The anchors will be at the bottom of the list of suggestions. Find your heading and click on it to select it.
  6. Click on the “apply” button to set the link, and click away from the linker to close the pop up..

Your link list will now bring the reader to that section on the page when the link is clicked.

Linking from Another Page

You can also use anchor links in a regular URL, so that when someone comes to the page from somewhere else, they will go right to the anchor on your page. This kind of anchor link isn’t automatically made available in the linker on other pages, so these have to be done manually.

First, you need to find the ID value for the anchor you want to link to. For instance, if you wanted to link to the “A Tutorial” heading on this page, the ID value would be “a-tutorial” If you’ve already got a link to the anchor on your page, it’s easy to see what the ID value is by looking at that link, otherwise, you need to go into text mode and find the heading to see what the ID is.

To link to that spot from another page (or anywhere, really) you would use the full permalink for the page, adding the ID to the link with a hash, like this:

https://xnau.com/content-anchor-links/#a-tutorial

Anybody using that link will go to the tutorial section directly.