WordPress makes creating web sites easy, but there is one handy web page feature that requires a tiny bit of coding: Bookmarks. Fortunately, it’s simple coding that anyone can do. These instructions apply to WordPress.com and WordPress.org.
Bookmarks allow you to jump to anywhere on a page (or post), from the same page, from another page on the same site, or from another site. You can also create links to go to specific point on a page, and send these via email, or use them for social media posts.
If there are sections on a page, like this one, you can create a table of contents at the top of the page, like the one at the top here, and allow users to click and go directly to that section.This is useful on longer pages, and remember that a one screen page on a large desktop monitor might already require a lot of scrolling on a mobile device. There are two steps for each bookmark: Create the bookmark, and create the link to it.
- Switch to Text or HTML mode (depending on which WordPress editor you are using). The mode is selected by tabs in the upper right, above the toolbar for the typing area. The default mode is Visual, and you can switch back at any time.
- Find the location for your bookmark. For example, to set the bookmark for the heading at the top of this section, I scrolled down to the heading. The line looked like this:
<strong>Create a Bookmark</strong>
Just ignore the characters around the text, but be careful not to erase or move any of them. If you accidentally delete something, go back to Visual editing and fix the appearance there.
- The bookmark should always go on the line above the heading (or paragraph, or image) that will be the destination for the link. If there is no blank line, add one with the Enter key.
- Type the bookmark code, including a name. For this section, the bookmark code is
- The name of the bookmark is between the quotes. It can be anything you want, but it should be short, simple, and descriptive, with no spaces or odd characters. You can put as many bookmarks as you want on a page, but each one must be unique. This bookmark could also have been
- You can also create a bookmark at the very top of the page, just in case you want to offer users a Return to Top link. That bookmark might be
- That’s it. If you go back to Visual mode, WordPress will show a little anchor symbol where your bookmark is. If you make any errors typing the bookmark, WordPress may delete it completely, or your page may look odd. If so, just switch back to the Text/HTML editor, and double check that the bookmark is typed correctly. Now you just need to create a link to your bookmark.
- First you need to type the word or phrase that will be the thing to click. For example, if you are making a table of contents, you need to type the headings at the top of the page. If you want to offer a Return to Top link, type that wherever you want to offer it.
- Highlight the text, and click the Insert/Edit Link button in the WordPress toolbar.
- In the box for the link, type a hashtag, and the name of the bookmark. For the example bookmark above, you’d enter #Create
For a link that goes to the top of the page, you’d enter #top
- Click Apply. The link is created.
- Bookmarks can also be added to a page address, so that when someone clicks a link to a page, they go directly to a specific place on the page.
- For example, the address of this page is http://tctext.ca/wordpress-bookmarks/
(it will be different if you are looking at this page as part of the blog page, but you link to this page using its own address, not the blog page address).
- To go directly to the Create a Bookmark section of this page, from any other page on the internet, the address is http://tctext.ca/wordpress-bookmarks/#Create
- That link can also be sent via email, or used on social media posts.
Bookmarks are a simple but powerful tool that make it easier for your readers to find things on larger pages, and for you to offer links to sections of your pages.
Making web sites better for you and your readers is one of the services I offer. If you’d like assistance with your site, please contact me.