Skip navigation

WordPress School: Links

Badge - Learn WordPress with Lorelle VanFossen at WordPress School.I’ve dreamed of teaching a class or workshop on nothing but links. Web links fascinate me. They are the connective tissue of the web, the glue that binds us all together in the virtual space, an economy in and of themselves, and links can save lives, they are that powerful.

In Lorelle’s WordPress School free online course I’m going to talk about links and all the ways to link within WordPress over the next few months. I have so much to say about links, I don’t want to overwhelm you, so let’s take this slowly.

In WordPress School: Addresses and URLs I talked about some of the various ways that WordPress generates links. In this assignment, we’re going to learn the very basics of how to make links in WordPress content.

What is a Link?

A link, also known as a hyperlink or hypertext link, is clickable text or objects that direct the browser to a web location or action.

Links - HTML Anchor Tag Code Breakdown - Lorelle WordPress School

The format of a link in HTML is:

<a href="http://example.com/" title="Example Site Title Here.">Link Anchor Text</a>

The Anchor HTML Tag breaks down with these selectors, often called attributes.

  • a – Anchor HTML Tag
  • href – Hyperlink reference, the link destination, typically a web page address
  • title – Link description, per US laws, is written as a short sentence or title describing the destination of the link
  • anchor text – The anchor text is the content visible to the user. The anchor text may be text or a image.

The link HTML tag (anchor) wraps around whatever is to be linked or clicked.

Screenshot example of a link hover balloon created by using the title in the HTML link.By using the title in the Link HTML, you are not only complying with web accessibility, when the mouse is hovered over the link, a balloon tip with text appears near the mouse cursor with the title displayed, helping the reader to know where the destination of the link will take them.

How to Make a Link in WordPress

To make a link in a WordPress post or Page, the sequence is the same for both the text and visual editors.

  1. Type the words you wish to be in the link or anchor text
  2. Select the words
  3. Click the Link words or symbol in the toolbar
  4. Screenshot of the Link Box in WordPress posts and Pages - Lorelle WordPress SchoolEnter the following in the popup menu:
    • URL: The address of the web page, website, or file you are linking to
    • Title: Enter the required title of the link destination in a short description such as the title of the article, name of the website, or something that tells the visitor where and what this link is
    • Open link in a new window/tab: DO NOT USE THIS. If you must, you are required by international laws to inform the visitor by adding (opens in new window or tab) within the anchor text to warn them.
  5. Click Add Link to embed the link within your content.

WordPress.com users have the ability to link to content on their site through the Link to Existing Content feature. Simply type in search words to find the post or Page and select it to create the link.

What You Must Know About Links and Linking

In “The Power of the Link” from 2005 I wrote the following:

The power you have over outgoing links is bigger than this. By linking to a blog or site, you are saying this site and page is worth reading. You are also recommending others link to that same post…

This value is a one way street. Do not expect that just because you link to a site or blog that they have any responsibility to link back to you. They don’t. You are only saying that they have said or shown you something of value you want to share with others. However, if the blog or site owner pays attention to their site statistics and referrals, especially if they are getting a lot of visitors from one particular link, they will often come visiting to see what you wrote about them to encourage your readers to leave your site to visit them. If they find value, the odds are likely that they may link back to you when they write something pertaining to your site’s topics…

Next time you create an external link on your site, think about the power it has to:

  1. Encourage others to leave your site to visit another
  2. Attract attention to your site and others
  3. Give energy to the process of that site moving up in the search engine page ranks
  4. Encouraging others to link to the same site or blog

Seriously, be inspired with your linking. Links have great power to influence, direct, and guide your readers.

Screenshot example of a link dump in a web page.Another no-no on is publishing link dumps. Link dumps are a lazy person’s way of linking, simply dumping a link into the content. https://lorelle.wordpress.com/2006/04/10/what-do-you-do-when-someone-steals-your-content/ Link dumps interfere with the readability of the content, and they are just ugly.

WordPress does its best to convert these into clickable links but often fails, leaving the reader with a link to a page not found when the link breaks. Take care and make your links readable by putting them in properly formed HTML links.

I will be covering links more as we go forward but here are some basic tips to get you started.

  • The anchor text may be different from the link title: In this example, I’m creating a link to an article about how links impact lives and the title inside of the link HTML is “The Power of the Link – Lorelle on WordPress,” words different from the anchor text. The two do not need to match, but the reader needs to know that the link’s destination matches its intentions.
  • Do not bold, underline, or force styles upon links: Links are styled by the WordPress Theme. Don’t like the look of them, you may modify them through the stylesheet not through the formatting options. It adds work and causes problems when you change Themes. If a link is naturally found within bold or italic text, it is fine. Never underline anything on a website, including links. Let the WordPress Theme do the hard work.
  • Keep links short and specific: The art of choosing the words for the anchor text is a skill. In general, keep links to one to four words for a phrase. Don’t link an entire paragraph or full run-on sentence. It makes it harder to read. Choose words that would make you want to click the link.
  • Do not use click here: Another web accessibility issue is to not use the words “click here” for your links. We’ve found that the use of “click here” tends to make the reader feel rather stupid, like they wouldn’t recognize a link when they see one. Incorporate the link into the sentence as part of the natural flow of reading. If you must point out that this is a link, be inventive.
  • Don’t put links in headings: Headings are generally styled rather dramatically from the rest of your content, and putting a link in the heading often doesn’t make the link stand out to the reader. Put links within the content so the link will contrast within the article.
  • Call-to-action links around images: I will cover call-to-action badge and button images late, but do know that if you wish to direct someone to a web destination visually, you may wrap a link around an image.
  • Do not force a link to open in a new window or tab: According to international laws for web standards, you are not permitted to force a link to open in a new tab or window without express instructions that it will open that way. Yes, WordPress offers this option, and I wish they’d remove it. It doesn’t mean you have to use it, but if you do, use it right. In 20+ years of doing this, I’ve only used this feature when writing a tutorial that required the other web pages to be open as part of the lesson. We know how to use the back button and find you if we lose you. If you are worth finding, we’ll be back, don’t worry.

For more information on links see:

Assignment

Lorelle's WordPress School Assignment Badge.Your assignment is to start adding links.

In your article series on your test site, if you haven’t already, add links in the first and second post in the series.

What should you link to? In the fourth and fifth articles in the series you will be making many links to resources, citations, and reference material. In the first and second articles, consider linking to definitions of words, phrases, and resources that help the reader understand better what you are talking about. You don’t have to explain the links, just incorporate them naturally into the content.

Stay tuned for more about links in future assignments.

This is a tutorial from Lorelle’s WordPress School. For more information, and to join this free, year-long, online WordPress School, see:

Subscribe to Lorelle on WordPress. Feed on Lorelle on WordPress Follow on Twitter. Give and Donate to Lorelle VanFossen of Lorelle on WordPress.


12 Comments

  1. Posted March 4, 2015 at 11:40 pm | Permalink

    Guilty of using “open in a new tab or window” and click “here” to add a music track playing in the “background” while reading my post.
    I couldn’t see a way to add the music from Youtube with my WP.com site and I also wanted the option for them to read without it playing it if they wanted as in this example.

    Couldn’t find the short code. Sorry. It’s always staring me in the face until I go looking for it and then can’t remember where to find it.

    I also like for them to be able to “toggle” back and forth between the blog and linked info without waiting for page reloads. Still illegal as done I now realize.

    Feel free to edit or delete this comment if the link is problematic. It certainly is an object lesson of what not to do, however.

    • Posted March 6, 2015 at 8:51 pm | Permalink

      Really? You provide a music track to listen to while reading your post? You know you can embed an audio file that someone can click to listen to whatever while reading your post without forcing a new tab or window on them? Yikes.

      Most people, and I’m talking the average person, wants to use their browser in a single tab, so forcing them to open really does upset many people. Let them figure out their own experience and don’t force it upon the user.

      You have great insights on all of this. Thank you for sharing. Keep them coming as many people think they way you do, and it helps to let people know they are not alone.

    • Posted March 6, 2015 at 9:55 pm | Permalink

      No, not any other posts yet. That massage post is the only time I have done that. I wanted to set and hold a mood while they were reading but also leave the option for them to read without it. Thanks for the link for embedding an audio file. I think I looked into it at the time but either didn’t understand it or could not get it to work. Like Red says on the Red Green show, “We’re all in this together.”

    • Posted March 6, 2015 at 10:35 pm | Permalink

      It’s a simple copy and paste of the code, but you have to upload the music first or link to music that isn’t on your site. Paste it in per the instructions for WordPress.com and it should work. I’ve used the SoundCloud Audio Player many times for podcasts. I teach it in my WordPress classes and will in these classes soon.

      As a semi-side note, I pulled an article from these WordPress Lessons I was going to publish on bold abuse. After seeing your article, I might put it back in.😀

      Since this is a teaching program, here is the lesson with bold. Use it like spice. Too much and it spoils the whole meal. Bold is meant for emphasis, but if you need it to emphasize more than a word or two, you are trying to control the reader’s experience, and enjoyment of your words. What happens is the eye ping pongs around from bold to bold and doesn’t read what you wrote. New writers want to add emphasis as if the reader can’t naturally imply the emotions and meanings behind the words, yet a shout in traditional media only needs an exclamation point, and a sigh could be heard in the words with no emphasis at all. Let the reader enjoy what you’ve written, and you are a darn good writer! Keep the bolds for those special moments.

    • Posted March 6, 2015 at 10:55 pm | Permalink

      Thank you for taking the time from what I am sure is a very busy schedule to critique my efforts. I was indeed trying to control the reader by leading/drawing them into the post with bolding certain key points. I always felt there was the risk of them just scanning but never read any data to support that so have adopted it. I can only assume you have seen proof that this detrimental and it would be prudent for me to stop. I’ll work on that.

    • Posted March 7, 2015 at 10:11 am | Permalink

      Lol! Anedotal and research back me up. I don’t deal in assumptions.

    • Posted March 7, 2015 at 10:25 am | Permalink

      Why am I not surprised?

    • Posted March 7, 2015 at 11:10 pm | Permalink

      LOL! I’m just no fun, am I?😉

    • Posted March 7, 2015 at 11:23 pm | Permalink

      Quite the opposite. I like your style of dealing with the students and I also realize it’s very time intensive for you which is why is truly appreciate each comment. Since this course may have a life beyond this current use, do you want to hear about typos in you material. Not grammar, just misspellings or incomplete words. I haven’t seen many, but hate letting them just slip by. I also don’t like splashing them about the forum in comments. Most of it is dropped letters: the you instead of your kind of thing that spell check passes over but grammar check will sometimes catch. I can proof 3 times and still see what I meant and not what I typed sometimes. It’s an open club.

    • Posted March 8, 2015 at 12:50 am | Permalink

      Always enjoy spell checks. I’ll go through and check. Some articles have a lot of code so it is easy to miss a word or three. Thanks.

  2. Posted June 11, 2015 at 11:02 am | Permalink

    I just noticed the linking tool in the WordPress.com editor no longer contains a Title field, but it has been changed to Link Text, i.e. users should now add the anchor text there. The only way to now add a title to the link is via html in the text editor, and how many people are going to bother to do that? Apparently WordPress.com has other priorities than making it easy to comply with accessibility standards.

    • Posted July 30, 2015 at 12:50 pm | Permalink

      Yeah. It comes and it goes as they are changing the WordPress.com interface to that disaster of a new interface…who knows what else will happen with this as it shifts and changes. Thanks.


10 Trackbacks/Pingbacks

  1. […] « WordPress School: Links […]

  2. […] you are new to the course or unfamiliar with WordPress addresses and links, read the tutorials on links and addresses and URLS […]

  3. […] covered links in a WordPress School tutorial. Links are called links, hypertext, and things you click, or some combination of these. In […]

  4. […] WordPress School: Links […]

  5. […] basics of HTML tags found in the content of a post or Page. You also explored how to create making links and today we are focusing on another aspect of linking in WordPress called intrasite links or […]

  6. […] to About: A link to the About on your test site to reinforce your expertise in writing this article […]

  7. […] around the image. However, WordPress does not add the link “title” attribute, so please edit the link HTML tag to include the […]

  8. […] More specific details on using links may be found in the link tutorial for this course. […]

  9. […] or Plugins, or for use in a WordPress Shortcode, it can be hard to find when all you see is the pretty permalinks and you don’t know where to look. WinkPress created two handy bookmarklets to quickly display […]

  10. […] WordPress School: Links – The basics of links in WordPress, how to add them to your posts and Pages. […]

Post a Comment

%d bloggers like this: