Linking Within a Page

Overview

Sometimes you need to link within a single web page.

For example, on a long page you might want something like a table of contents: a few major topics listed at the top of the page, each of them linking to a section further down the page. These are sometimes referred to as page jumps or jump links.

This kind of link is valuable, but WordPress doesn’t make it as easy to create as other links. It takes two steps:

1. Create a destination for your link.
2. Create a link that goes to your destination.

Besides these instructions, you can read more about page jumps on WordPress.com’s Splitting Content help page.

Step 1: Create a link destination

This first step requires you to use the WordPress editor in Text mode rather than the default Visual mode. Switch to Text mode by clicking the Text tab in the upper right:

This view might look a little intimidating at first, but for this exercise you can ignore the parts that aren’t plain text. Just scroll down until you find that place that you’d like the link to point to.

Let’s say we’re looking for a heading that says “Join Our Community”:

Notice that the phrase “Join Our Community” is bracketed on either side by “h2” markers. These mark the text as a level 2 heading:

• <h2> means “the heading starts here”
• </h2> means “the heading ends here”

To turn this heading into a destination for a link, we need add an id to the initial <h2> marker. We do this by changing the heading from:

<h2>Join Our Community</h2>

to:

<h2 id="joinus">Join Our Community</h2>

So we’ve added a marker id=”joinus” indicating that hyperlinks can jump to this spot by using joinus in the link’s address.

Spaces matter! Leave a space between the h2 and the id, and no space next to the equal sign or quotes.

The ID name should be brief and meaningful. There are plenty of rules for allowable ID names, but you’ll always be safe if you stick to lowercase letters.

Our final link destination looks like this:

Step 2: Create the link

Okay, enough of Text mode. Switch back to Visual mode by clicking the Visual tab in the upper right of the editor window. Back to user-friendly:

We’ve created a place for the link to point to. Next we need to create a link that actually goes there.

Highlight the text you’d like to use as a hyperlink—in our example, “Join Our Community!”–then click the link button:

WordPress will prompt you for the link’s destination. Enter the pound sign (#) followed by the anchor ID you created earlier:

Click Add Link and you’re done.