Easy Commenting Tricks Using HTML!

freedigitalphotos.com / renjith krishnan

August 7th: This post has been newly edited with direct copy-and-paste tags and new sharing graphic! So sorry for any confusion :)

Tutorials are made for sharing! Please use this graphic and link  back to this post :)

This is not the post I meant to write today; I was hoping to show off some stitching, but alas it was not to be. Yet :) Instead, I wanted to share a really quick and easy way to format your comments using simple HTML coding tags!

I've noticed a lot of comments elsewhere online lately, while catching up with my blog reading, where people are copying and pasting the URL address of a website in the comments instead of creating a direct hyperlink. There's a much easier way!

HTML, which stands for Hypertext Markup Language, is commonly known as the formatting script behind webpages. But did you know that you can use snippets of HTML code, called HTML "tags", to enhance the comments you leave online?!

Programmer Mike Fitz has written a witty overview of Simple HTML for Formatting Blogger Comments that covers italics, bolding and hyperlinks. And this great How To Format Comments post at Skeptico goes further and shows how to indent and make lists. All the possible tags are listed here, although not all work on all platforms.

But these resources (and others) assume a working familiarity with HTML coding, which really isn't necessary to make your comments do what you want them to do! Instead, you can memorize a few simple variations on the basic formula and use them whenever you like. Although it might seem hard to remember them at first, after you type these same sequences a few times, they will become almost automatic :)

I'm going to cover the three codes I use most: bold text, italic text, and inserting hyperlinks - links to other places online - which is great for sharing information!

Why Should I Take The Time To Comment?

Commenting is absolutely integral to the exchange of information online. From a blogger's perspective, comments let them know that people are reading, and by sharing what they do or do not like about a post, those commenters help the blogger improve their content. From a commenter's perspective, they can share their opinions, suggest other perspectives and ask questions, thereby making the content personally relevant and useful! And ensuring the creation of more good content!

This interaction brings value to both parties and the sharing of information benefits everyone, especially in the crafting world where new skills, techniques and ideas are constantly flourishing! Commenting helps those good things to grow. Share the love!

How Do I Know If I Can Include HTML In My Comments?

There are many different website platforms, and not all accept HTML, mostly because this is an easy way to prevent spammers from leaving bad links. Other platforms may support some codes but not all, and this is very frustrating especially since this is rarely stated. When it comes to blogging, there are third-party systems like Disqus (which has it's own Code List) and CommentLuv that have their own rules. Other sites may require that you be signed in before accepting coding.

Sometimes the only way to know is to try and see if it is accepted - but if there is no "Preview" before posting or an "Edit" after posting, your comment formatting may not post correctly. This can be embarrassing, especially if there's no "Delete" option!

With Blogger, some of the codes it will take appear under the comment form box:

This is the comment form here on ES. Here is a close-up of the text:

These three tags are shortened versions for the bold, italic and hyperlink options, which are the basic HTML codes that are most accepted across the web. Blogger does take others, but I don't personally use them and so can't remember them, LOL ;)

The Basic Format of HTML Tags

I've done this in diagrams, for ease of reading! I'll provide examples to copy-and-paste (newly edited without spaces) so you can try all these yourself at the bottom of the comments :) All tags follow this basic order of "attributes":

Note that there are no spaces between characters: if spaces are left, the formatting may not work correctly, or if it does, there will be extra spaces in your text.

All tags use pairs of "Angle Brackets" (see different types of brackets here):

The "Forward Slash" stroke that starts the Closing tag is the key located to the right of the period key on QWERTY keyboards and doesn't require holding the Shift key.

How To Emphasize Text: Bolding and Italicizing

Emphasizing certain words in your comment is a great way to get your point across, especially for indicating importance or excitement. The most common way to do this is to type in CAPITALS, which I am frequently guilty of when elated, although this is often considered to be typographical "screaming" and so is not polite (oops!). I also use asterisk symbols - *** - for this reason too, like *this*. Usually, this is to indicate an action - like *throws confetti!* - and so this is a bit of a bad habit too, LOL :)

Both the Bold and Italic HTML Tags are what I think of as "Mirror Tags", with the same character in the Opening and Closing Tag. This makes them easy to remember, and easy to type! But beware of forgetting the Closing tag's Forward Slash (/)!

EXAMPLE: Her new stitching project is absolutely amazing!

EXAMPLE: That new blackwork pattern is just awesome!

Remember to keep your punctuation marks - in these examples, the exclamation marks (!!!) - OUTSIDE the closing tag, or they will be formatted too!

For extra razzle-dazzle, you can combine both types of emphasis in one sentence:

EXAMPLE: While I was stitching tonight, I stabbed myself with my needle! Ouch.

You can also emphasize as many words as you like within the same tag, but long sequences of bolded or italicized words can be a little bit hard on the eyes :)

Finally, you can add the two tags together for bolded italic text:

It doesn't matter which tag comes first - the b or the i - as long as you are consistent with the order of the tags! Think of them as brackets within brackets - instead of mixing them up - [{ ]} - keep them together and nestled inside each other in order of use - [{ }]! It's just good practice, for when you might want to insert some special emphasis in an already emphasized sentence. That's a called a "nested" tag!

How To Add A Hyperlink: It's Easier Than It Seems!

Hyperlinks are a little bit more complicated and require a bit of special attention at first. They are Mirrored but have a special insert, and so the formula is rather odd, but once you get the hang of it you'll wonder how you managed without it!

Say I want to share my blog address. I could cut and paste the URL like this:

http://www.eglantinestitchery.blogspot.com

Or I could share a link, with text of my choosing: My Blog.

With the plain text URL, if someone wants to visit the address, *they* have to cut and paste the URL into their own browser. This is work, LOL! With a hyperlink, all it takes is the click of a mouse to follow through to the URL!

Edited Note: Hyperlinks were traditionally bright blue and underlined, as in the Example of Appearance below, but that is no longer always the case. My links are unlined burgundy, for example, and they may vary forms on other sites - to check if a bit of text is a link, hover your mouse over that text: the pointer will change!

This may seem a little scary at first, but it's simple when you break it down. First, the Opening and Closing tags are like the Bold and Italic tags in that they have the same character mirrored in both: the a.

Note the single space between the Opening a and the HREF! The formula will not work if that space is omitted (ask me how I know, LOL; it's a mistake I make often).

So it is only the Hyperlink Formula, which is made of two parts, that is strange:

The first part of the formula is the HREF= attribute:

And the second is the URL - the website address - that is placed between the quotes:

So there you have it! Not so bad is it? Be sure to practice in the Comments on this post! If you have trouble, I'll try my best to help you, don't be afraid to try multiple times! If at first you don't succeed, try and try again LOL ;) That's how I learned!

Here's a quick list for easy reference:

How Do I Know If My Comment Was Read?

Be aware that bloggers handle comments differently! Some, like myself, will reply in the comments section, so you need to check back for answers. Most bloggers prefer to respond via e-mail, but cannot do so if your e-mail address doesn't come with your comment. This is commonly known as the "No Reply Blogger" syndrome, which is explained in the original tutorial at Pleasant Home, where this button comes from:

You may have seen it around online. This is a simple problem that is easily fixed, and there are lots of tutorials online to help. If you open a Google+ profile, you may temporarily revert to No-Reply, and sometimes the system glitches so if you haven't gotten responses for a while, check to make sure that your e-mail address is linked on your Blogger profile. Also, it is a good idea to set up a secondary e-mail address (aside from that of your blog) for this purpose :)

And keep in mind that some Bloggers do not respond to comments at all! It's not their style. This can feel a bit frustrating sometimes, but keep in mind that everyone has a different approach to blogging; my philosophy is that you never know what a kind or thoughtful message will lead to, or how it may brighten someone's day, and so I believe that it is better to comment than not to comment.

However, if you leave several messages for a person who normally responds (and are active online at the time) and they do not do so within a month or two, then you may want to take your thoughts elsewhere where they'll be better appreciated.

How Do I Practice My New HTML Tagging Skills?

You take them out for a spin of course :) Feel free to comment on this post!

Here are the copy-and-paste versions to try if you don't feel confident typing at first:

EDITED: I've now figured out how to remove the spaces, so you can copy and paste these HTML tags directly with no editing required! So sorry for the confusion :)

For bold text:                    <b>TEXT</b>
For italic text:                    <i>TEXT</i>
For bold italic text:      <b><i>TEXT</i></b>

And, finally and most importantly, for hyperlinks, remove the dash between the a and the href (I put it in to keep the original space):      <a href="URL">TEXT</a>

When you try out your hyperlinks, try and describe the content of the site link in your text. This is a good habit to get into, so people know in advance what to find on the other end and so they can be confident that the link is a good one (as opposed to a bad spammy one). This is especially important when commenting on a new blog where people don't know you yet, since junk links are so common now.

Speaking of spam, I don't accept anonymous comments anymore, so make sure you're signed in to Blogger (or the alternate of your choice, like OpenID) before you start practicing or your comments won't show up! And have LOTS of fun :)