Daily Kos Editor Toolbar: Creating a Hyperlink

Using the tool named "Insert Link (⌘ + K)"

1. Think about your link text (what you want the clickable hyperlink to display) 
2. Have the URL for the page you want your link to reference handy. 
3. Decide where you want this hyperlink to display in your story or comment. 
4. Put your cursor in that location and click.
5. Then click the Insert Link tool OR use the keyboard shortcut command + k (mac) /ctrl + k (pc).
6. Type in the display text. Hint: Words conveying relevant information are much more effective than "click here."
7. Add the URL in the other field, the one displaying "http://" as a prompt. Best method is to copy & paste it from the source into the field.
8. Double-check your display text.
9. Click "Insert Link."
10. Save the draft comment or post.

If you prefer, you can follow a slightly different route: Instead of clicking the Insert Link tool and then keying in the display text, it is possible to select text already created and then click the Insert Link tool. Whatever you selected will automatically be loaded into the Display Text field. Complete the hyperlink creation by pasting the relevant URL into the appropriate text box.

NOTE: Hyperlinks may change color in some contexts. A hyperlink will be orange when you have not yet clicked through to see the destination URL. If you hover over a hyperlink, it may change from orange to blue and underlined. A visited hyperlink may display in purple.

Long explanation of the process, with more context.

One of the most valuable opportunities offered by the world wide web is a capacity we often take for granted: the ability to move from one online source to another via a "hyperlink." We make it easy for site members to add hyperlinks to content they create for the site, in both stories and comments. Indeed, we strongly encourage users to use them liberally in order to support their arguments and give appropriate credit to other sources of evidence and information.

Selecting the link tool as shown in the screenshot of the toolbar above will open the link editor, a built-in "modal" (user-friendly display) that will create a hyperlink. That link tool selection may be made either via the mouse/trackpad arrow or by keyboard shortcut (command + k or ctrl + k) The link editor displays two fields to complete for the creation of a hyperlink: one for the URL to which the associated text should redirect, and one for the text to be displayed in association with the URL. That's all it does, and it will put the link wherever you've initiated the link tool process. 

Please keep accessibility in mind when creating a hyperlink. Instead of a hyperlink that is simply "Link" or "click here," in other words, it's better to provide meaningful text with the link. For people who use text readers, a link labeled "here" or "link" does not convey enough information to persuade anyone to click on it.

Often, users begin the creation process by highlighting the text they want to display in association with the link, and then selecting the link tool. The link editor modal will then open with the selected text already visible in the "display text" field, so then you need to paste in only the appropriate URL and click Insert Link. 

The URL field will automatically add the https:// sequence to the beginning of the text you enter, and it won't duplicate it if you've pasted in a complete URL already. That's the only helpful adjustment the modal will make; the rest of the URL must be complete and accurate.

It is also possible to begin the hyperlink creation process without first selecting text. Start by putting your cursor where you want the hyperlink to be positioned, and click to fix the cursor's position. Then select the link tool, either via keyboard shortcut (command + k/CTRL + k) or trackpad/mouse arrow. Selecting the link tool will open the link modal as detailed above. Once both fields of the link modal are complete, click the Insert Link button.

If you change your mind altogether about adding a link, or decide you'd prefer different display text than what is shown in the modal, it's possible to dismiss the modal. Either tab to the Cancel link and enter that choice or click on the X in the upper right corner.

When you decide to insert the link, its behavior can be checked/confirmed in both comment and story drafts. A link added to a comment is clickable/confirmable when the comment is in preview mode; hovering over the link will show the URL in the lower left corner of the page. For a story in draft mode, a preview of a link ("Open in new tab") is accessible by hovering over it; the URL will display in the lower left corner of the page. 

Currently it is not possible to edit a link after it has been inserted. To delete an already-created link, simply delete the hyperlinked text. 

Remember to save changes to your story draft when new content is added, including hyperlinks. That step is not an automatic one, but instead must be actively initiated by the story author by using the Save Draft button in the right sidebar for the story draft window.