One of my pet peeves is when you all put hyperlinks in the comments section, but do not embed them. Sometimes, this is not a problem, but other times, the link is so long that it can, in essence, break the comments section for some users. Since I wanted to play around with screen captures and Photoshop, I figured I would make this quick tutorial for you, which appears below the fold. If you do not know how to embed your hyperlinks, please check it out.
The following is what your hyperlinks in the comments section SHOULD look like:

Good patriots embed their links so that loose urls do not get in the hands of the terrorists.
The following (with the names blurred to protect the guilty) is what it should NOT look like:

Clearly, this commenter is working with the terrorists.
While that link is not quite long enough to “break” the comments section, you get the idea. We want the links embedded, much as they appear EVERYWHERE ELSE ON THE INTERTRON. In fact, the comments even have a handy tool to do just that with relative ease.
Below is a “virgin” comment box. As it is, there is just the box for you to type your comment, and nothing else. However, if you will notice, there appears to be a cryptic button in the upper left corner of the comment box with a RED ARROW pointing to it.

*** CAUTION *** This is just a simulation. Red arrow is not present in actual comment boxes.
Click on that button, and you will see the following:

Do the wonders of the intertron ever cease? Clicking on that button made a bunch more buttons magically appear.
As you can see, there are now a number of formatting options available to you in your comment box. Time to start entering our comment.

You can actually write anything you want there, but I wanted to display my allegiance to the fifth column folks at NPR.
Once your comment is entered, highlight it.

Yawn.
Once you have your comment highlighted, as illustrated above, look at the bar filled with formatting options and click on the “Link” button.

True patriots click when they are told.
Once you have clicked on the link button with your text highlighted, a window will appear. This does not always look the same in every browser, but they are remarkably similar. Here is what it looks like in Firefox.

I wonder if that ‘http://’ is a hint?
In the area provided for you to enter text, enter the url of the hyperlink you wish to share with all of us.

Cut and paste your link here, foolio. Or just type it in manually, if you so desire.
Once you have done that, click ok. As you will soon observe, your comment now appears to have a bunch of formatting. Don’t panic. That is a good thing. It should look like this:

ZOMG look at all that hypertechnical formatting! Human sacrifice, dogs and cats living together – mass hysteria.
Once you are done with your comment, click on “Submit Comment” and you should then see the following, complete with a perfectly embedded hyperlink.

As the cheese eating surrender monkeys would say, “VOILA!”
See! That wasn’t too hard. Be a good Bundes, use your training, and embed your links.
Or the terrorists win.
srv
Since 99% of the folks miss the button, I’ve always assumed the tags button does not have an adjustable default (expanded) in WordPress.
WordPress defect or admin error?
Billy K
Or you could just type (a href = “http://www.npr.org/templates/story.php?storyId=162”) I was listening to NPR(/a)
I know how to do two things in HTML and this is one, so I’m gonna use it, dammit. I guess I’m old fashioned.
But thanks, John, for thinking about the tarrists.
capelza
This is a geeky Alexander site, geek that I am.
Okay I am trying this..and if it works…yeah for me. Thanks.
libarbarian
I’ve spent the last few years typing the tags in by hand :P.
DOH!!!
Billy K
P.S. God, Firefox is ugly.
capelza
Another, maybe right this time…
I have bookmarked this post, so I promise to do it correctly from now on.
Zifnab
It’s not Firefox, it’s the abysmal Apple Interface. Did I mention that Apple sucks? Cause Apple sucks.
:-p
Dreggas
You forgot something wise ass, tell them to put Target=”_new” inside the tag after the URL but before the “>” that way the link opens in a new window and there’s no need to use the back button.
scarshapedstar
I’m gonna take this occasion to be uber leet and s p a c e stuff out for the hell of it.
EJ
I’d always put links in by hand, and I always wondered why sometimes there are bad embedded links formatted like “http://http://www.blahblah.com”. Now I know.
Libby Spencer
Jeez. I never noticed the button and was wondering why you didn’t have a tool bar. All this time I’ve been typing in the code manually… Duh.
Buck
This is wonderful information to have.
On a number of occassions I have seen John piss and moan about correctly embedding links because he was getting “goddamn tired of doing it for you” but when he said to “click the button in the upper left corner” I was always left meandering around up where it says PajamasMedia and never could find the button!
Needless to say I have never even tried to embed or even cut and paste a link.
I’ve always been kinda scared of John.
Bombadil
So, John has gone from someone who can’t figure out how to use Google to learn how to screen-print on a Mac to someone lecturing about imbedding links in postings (with 8×10 color glossies, no less), all in one morning.
Is there no end to this man’s learning power?
jcricket
So you admit to misrepresenting the actual situation? Is that like all your “fake but accurate” reporting about Iraq?
I bet you have a backpack too, and sit on benches. I’ve seen the Tancredo commercial. I know what you’re up to!
Jake
Excellent, is there a way to put this as a tutorial in the sidebar?
Or the user could just right click and select open in New Window (Tab if using FFx).
Abe Froman
thanks Jon, I just figured out how to do this on my own this morning. You’re timing, once again, is imppecable. :)
jnfr
Do not, please for the love of all that is chocolate, start using code in your links to force new pages to open. Using the back button is perfectly proper web protocol. Opening separate pages makes baby Jesus cry.
Michael D.
What if you don’t have Firefox??
Punchy
Thanks for the tip, John. It was very useful. Now check out this…Cat fight!
http://thinkprogress.org/2007/11/13/catholics-united-pro-life/
caro
kewl
Jake
It works the same way for IE.
Nash
With one unembedded link, Punchy goes in for self-parody or insufficient self-awareness.
I like it either way.
Dreggas
I like making baby jesus cry, and having to leave the site I am on (in the same browser) is kinda annoying to me, one reason I like Atrios’ little check box to open links in a new window.
Dreggas
True,
I was just making it easier for the less tech savvy or more lazy.
capelza
I have Safari..how is it different than Firefox.
I really, really like Safari except for one thing netscape did. In all the places I had to log in, it always remembered my name and password. Safari doesn’t do that, unless someone knows the secret.
Please be patient, I am so old I got my degree using a typewriter and white out. Tech savvy not, I am.
John Cole
Are you people blind?
Check this website out again. Pay close attention to the portion in the top right hand corner, underneath the graphic, where it says:
“Check here to open links in new window.”
Funny, that.
Wilfred
Are we still doing the porno title contest?
jnfr
I’m perfectly capable of opening a new page when I want to, and so are you!
I just wish John would let us embed images. That would rock.
mk
Okay. But, I still think tinyurl is an easier way to accomplish a link that doesn’t break the thread.
AnderJ
Damn, John beat me to pointing out the box in the side bar.
Rudi
You have really turned into a Liberal. Macs and Firefox aren’t “free market friendly”. Even though he’s a Librul, Billy Gates won’t make billions more off of YOUR types at this DU type blog.
Tony J
It certainly makes me cry. My PC is so old she gets all autistic and crashy when I have too many windows open.
Thanks for the tutorial, John. I use most of the tags but had always viewed the Link option as something I didn’t quite get and was too chicken to actually ask about.
And since I now know how…
Why, oh why do people that having this as your State Flag might be considered ‘racist’?
Tony J
Oh.
Need more work on Phase One, methinks. There should be a “think” before the “That”.
Sad sigh.
Tony J
And “That” should be “that”.
Yet again, life shits on my eiderdown. Thank you very much drink and drugs.
Svensker
I’m so ashamed.
crack
Am I doin’ right?
https://balloon-juice.com/?p=9094#comment-430484
Clutch414
Would you prefer us to embed our lolcatz?
Bombadil
No.
Elvis Elvisberg
Ditto.
But I just used the button, and avoided having to type the word “blockquote”! Hooray!
Punchy
Fixed, apparently, for Tony J. :)
Michael van der Galiën
It’s very simple:
write (but then in one line)
write here something like, ow I don’t know, lets be create, “click here”
Wuzza!
and to the commenter who mentioned the porn, here’s a nice link for ya.
Face
Heh. And all this time I thought “a tool bar” was where the frat guys drank.
‘Puters are silly.
jcricket
No, a tool bar is where all the right wing pundits and talking heads hang out. Ba-dum-bump.
UnkyT
In its standard form, kinda. But there are many many skins available for it that make it much better looking. My current fav is iFox Smooth
RSA
Have you tried opening up Preferences (under the Safari menu), clicking on the AutoFill icon, and checking the box “User names and passwords”?
By the way, very nice tutorial, John.
guyermo
what’s with all this opening new windows? tabbing’s where it’s at, folks.
Delia
test
Delia
Well, that didn’t work. Let’s try again.
Test
Delia
One more time. I’m not sure what I’m doing wrong.
test
MNPundit
You want Hyperlinks? Here’s the post I wrote for the morning after the November Elections, crowning myself the King Nerd of the Internets.
“As when death smites the swollen brooding thing that inhabits their crawling hill and holds them all in sway, ants will wander witless and purposeless and then feebly die, so the creatures of Sauron, orc or troll or beast spell-enslaved, ran hither and thither mindless; and some slew themselves, or cast themselves in pits, or fled wailing back to hide in holes and dark lightless places far from hope.”
–JRR Tolkien, The Return of the King
Delia
I give up. And I’m using Firefox.
Tony J
I now go wash dishes. I know my place.
Soft weeping, interspersed with occasional clinking and some splashing.
MNPundit
Addendum: I am amazed so many of the links still work after over a year.
Tax Analyst
Thanks for the clue, John. I needed one. I had to copy & paste it to a word doc so I can print and then look it over under my nose instead of on-screen since I don’t really have a handle on it so far. I’ll refrain from linking until I can frigure it out.
It’s a good thing they have other people here at work help customers deal with navigation and tool bar functions and such crap. Much of it still mystifies me.
Jake
Err. BJ’s gots one o’ them too. Check the upper-right.
Mithi
As a rule I have JavaScript disabled so I can’t actually see (or use) the formatting button. Might consider putting a link to a rundown of available code by the comment box, or just a message that JS needs to be enabled in order to easily use advanced features.
g-rant
test
test
test
testtest
test
Punchy
I bet links are the only thing John’s embed with nowadays…
/drum roll, cymball crash
Bubba
Thanks for teaching me that! Now I can link to Monkey Armies!
Bombadil
Test
Rick Taylor
I embed links whenver I can, but sometimes it doesn’t seem to work. I embed the link, and everything after the link doesn’t show up in my post.
Here’s an example. These sentences come before the link.I’ll write more sentences after, but neither the link nor the sentences after the link will appear.
The link
And now here’s stuff after the link that doesn’t appear.
Rick Taylor
Ok never mind. I didn’t appear in preview mode, but did when I actually posted it. ^^
RSA
On my platform, that mostly happens with URLs that include characters like question marks, and unpredictably otherwise. It posts fine, though. (Do ordered lists work, or am I remembering incorrectly? Here goes:
This
is
a
test.
Looks fine in preview.)
RSA
Nope. No numbers.
Bombadil
Don’t know why it works, but if you hit “enter” one last time after the last line of your post, you will generally see everything formatted in Preview.
MobiusKlein
What I find amazing is that he lets raw html go in this box.
Same as clicking new link checkbox
Same as un-clicking new link checkbox
MobiusKlein
Ah good, it does not go in – just looks like it in the preview.
mk
Delia, thanks for the opportunity to test John’s tutorial myself.
I doubt John would be angry with you if you chose to go the tinyurl route. The directions are really easy to follow. You can embed the tinyurl link in your browser’s tool bar. Coupled with screen tabs, you can get a 200 character link tamed with a couple of mouse clicks. And, I suspect it will be a while before the terrorists win if you go that route.
wvng
just testing, with an interesting link. Anonymous Liberal says:
According to officials cited in the article, it’s not clear whether suitcase-sized nuclear weapons have ever existed. Apparently, the U.S. at one time produced a device that could be carried in a large backpack (and required two people to detonate), but they’ve all been destroyed. And the Russians were long rumored to have created such a device, but no one has ever seen one.
Moreover, such a device would apparently be incredibly difficult and expensive to make and would, at best, only be operable for a period of months (eventually the radiation would fry the circuitry).
NickM
I was testing.
Thanks!
Rudi
“>a href=”Actual URL “>What you want as URL text reversed. The link buttons should create the HTML code.
What you want as URL text
Tim F.
That won’t fly. I basically don’t click a link unless I can tell where it goes. For that reason I dislike TinyURL, discourage its use and don’t ever plan on clicking through any.
Libby Spencer
That’s the one I hate to do manually too. It’s such a long word. I can embed URLs in my sleep and in fact usually do it manually because it’s so automatic that I find it’s faster than clicking through the tool bar but otherwise I’m a lousy typist and it really saves time to use the buttons for everything else.
Besides I like learning new stuff. I bet some of the other places I hang out where there aren’t tool bars have this same button. This could change my world.
Punchy
I nevah thougt this was about an actual nuclear bomb in a suitcase. I think it’s about wrapping radioactive material, such as polonium or uranium, amongst a bloc of C4 or some such shtuff.
IOW, why the direct damage would be minimal, the fear of radiation sickness and such would cripple a city and bring every trial lawyer a fortune.
tBone
One of my pet peeves is when you use the phrase “you all” to refer to a subset of commenters. We all hate that.
zmulls
Ah..yes…yes…I see….now I can embed links!
Excellent!
les
God, it’s nice to be so easily pleased. I can haz self estym?
Billy K
Wrong again. Every Mac browser I’ve used looks great, except Firefox. Mozilla even admitted it looks like crap (actually it looks like a Windows app) and said they’re gonna fix it in v3.
Your hatred for Apple only makes me stronger.
Billy K
Apparently I am. I’ve been coming here for about two years. The last year I’ve visited every day. I’ve never seen that box. Thanks for telling me, cause I strongly prefer to open links in a new window.
It’s hard to find one line of 8-point text in your site design.
mk
S’okay, Tim. I agree, that’s a problem with tinyurl. Because it’s a problem, when I use it, I tend to announce the link: title, author, site, and tinyurl as a blockquote. True, if you don’t know the commenter, you take a risk that they’re spoofing you into something nasty. But, where I seem to have no problem following John’s tutorial in Mozilla, for some reason, like Delia, I’m having trouble making it work in Firefox. But John gets to set site rules. And, I’m happy to follow them. Does make it tough on Delia, however.
Phoebe
This is perfect.
Perfect perfect perfect.
MobiusKlein
<a href="javascript:alert(this);"> fancy? </a>
FaulknA
It’s like a Zen kind of thing! Thank you!
Curious
Now I know my abc’s.
Won’t you come and play with me.
Zuzu
Hey, I bacame a patriot after all those traitorous screw ups along the way! Thanks.
But I have to tell ya it’s been heck on wheels figuring out the link thing. I’d hit the “link” button, enter the url, etc., submit, hit the “/link” button, but no hyperlink. Other variations left me with disappearing text or all sorts of headscratchers.
Finally I figured out to enter the name of the link after the end of the url and before the close link, like this: html”>Name of Link
Presto zesto, a hyperlink !!!!
Zuzu
Hmm, my link box just asks if I want an external link or not.
Zuzu
Sorry, I meant it asks if I want the link to open up to a new window.
Zuzu
Wha…? What’d I do to deserve a little box with a red X?
Krista
No shit. I never noticed it either. Then again, I don’t pay attention to the ads, either.
BTW, what’s the diff between Link and Ext. Link?
Krista
Zuzu, evidently extreme emotion is frowned upon. Any more than two (I think) exclamation or question marks, and it does that.
Let’s test it…
Holy crap!
Holy crap!!
Holy crap!!!
Holy crap!!!!
Krista
Yep, any more than two, and you get the “x”
capelza
RSA…thank you…that is exactly what I wanted.
RSA
You’re welcome, capelza.
maxbaer (not the original)
Thanks for the tutorial, John. I see a post mentioning Big Audio Dynamite the other day. Here’s some pre-BAD. I hope!
maxbaer (not the original)
OK, I,m simple. The simple things are all complicated.
Andy K
John, is there anywhere that I can nominate ya fer “Most Helpful Blog Entry”. ‘Cause, goddammit, I’ve been tryin’ to figure out how to do that fer a long, long time. My kid was no help(trust me, he went to bed with no dinner fer quite awhile) and I’ve been too ashamed to ask fer help.
Delia
Hell, I can’t make it work with either Firefox or IE. It’s TinyURL or or the long, waving URLs.
http://tinyurl.com/3cns7g
Bob Smith
Very good tutorial, just one question
Where is the highlight button?
C’mon, someone had to say it.
Kewalo
It makes me feel like dancing…
If this worked it is really cool.
Psycheout
What a bunch of n00bs! Good post, John. I agree with you completely this time.
Psycheout
Delia, just type
<a href=”http://whatever.com/whatever.html”>This is my link</a>
if you really need to put a link in your comment.
It should end up like this:
This is my link.
Psycheout
Oh, blast. Entities are automatically converted. Sorry. You’re on your own.
Zuzu
Ah, mystery solved. Thankee.
RSA
Yes, automatic conversion is a bit of a pain. For example, it’s hard (impossible?) to include stuff that looks like an HTML tag. Here’s what should work:
ampersand lt semicolon bogus tag ampersand gt semicolon: <bogus tag>
But it doesn’t. And if I use hex codes, the software just ignores my post altogether.
crack
Oddly enough this example shows a problem with embedding links, they are lost in copypasta. The ? in the original was an embedded link. Is there a quoting function that’s available to quote comments and include links?
Oh, and I second Tim F.’s sentiment on tinyurl, impossible to know what your getting sent to. A goatse dream. I only use tiny at Delong’s place because i can’t embed there.
Delia
Well, I can’t embed here, apparently. So if I need to use a link, I’ll have to use tiny and leave a hint about the content.
CalD
I usually just type the code for the links right in my post, since that works for almost any blog and most don’t have helpful formatting buttons like Balloon Juice. (Why can’t all blogs be Balloon Juice?) It’s really easy.
All you have to remember is the basic open tag for a hyperlink:
<a href=””>
and of course, the close tag:
</a>
Then type some text between the two tags for your link label, like this:
<a href=””>Balloon Juice</a>
Then past the address (URL) for the page you want to link to right between the two quote marks in the open tag, like this:
<a href=”https://balloon-juice.com/ “>Balloon Juice</a>
And voila, it comes out looking like this after you hit the submit button:
Balloon Juice
Simple.
CalD
Awe, bummer. Damned thing parsed my tag examples. And I thought I had coded them so cleverly. I’ll try one more thing.
First the basic open tag for a hyperlink:
<a href="">
and of course, the close tag:
</a>
Then you type some text between the two tags for your link label, like this:
<a href="">
Balloon Juice</a>
Then past the address (URL) for the page you want to link to right between the two quote marks in the open tag, like this:
<a href="https://balloon-juice.com/">
Balloon Juice</a>
And voila, it comes out looking like this after you hit the submit button:
Balloon Juice
Simple (I hope).
CalD
Better. But since I’ve already made this big a mess already…
Basic open tag for a hyperlink:
<a href="">
Close tag for a hyperlink:
</a>
Add the link label text:
<a href="">
Balloon Juice</a>
Paste the URL between the quotes in the open tag:
<a href="https://balloon-juice.com/">
Balloon Juice</a>
Finished link:
Balloon Juice
CalD
Finally! Jeez. (Note to self: Don’t ever try that again.)