| 
  • If you are citizen of an European Union member nation, you may not use this service unless you are at least 16 years old.

  • You already know Dokkio is an AI-powered assistant to organize & manage your digital files & messages. Very soon, Dokkio will support Outlook as well as One Drive. Check it out today!

View
 

htmlcomment

Page history last edited by Laura Gibbs 6 years, 3 months ago

 

Tech Tip: Create Clickable Link in Blogger Comment

 

For this tip, you are going to learn a little bit about HTML, which is the "behind the scenes" language that makes webpages work the way that they do. HTML stands for "HyperText Mark-up Language," and links (hypertext) are very much at the heart of HTML. You can find out more about the history of HTML at Wikipedia if you are interested in learning more. 

 

Most of the time, you don't have to write your own HTML. Instead, you are using an editor (sometimes called a WYSIWYG editor: What You See Is What You Get) that creates the HTML for you based on the editor commands that you use. When you click "Bold" in the editor, it is adding <strong> tags to your text. When you click to make a bulleted list, the editor is adding <li> (list item) tags to each item in the list, and so on. For this Tech Tip, you are going to learn how to type your own HTML tags, using the <a> tag to create an active clickable link in a Blogger comment. 

 

Links in Blogger comments. You have probably noticed that if you paste an http web address into a blog comment at Blogger, nothing special happens; it just appears as text. That is because the blog comment box does not have a WYSIWYG editor; it is just a box for typing text. But if you know how the <a> tag works in HTML, you can type the HTML code into the text box yourself and, presto, you will get a clickable link, as you can see here in this blog comment: comment with clickable link.

 

Here are the step by step instructions:

 

1. Blog Post: Start by publishing a blog post at your blog called "Tech Tip: HTML Link" (with Tech Tip as the label) and in that post please let me know if you have ever written/edited HTML before, or if this is your first time using HTML directly. Publish the post. You will then leave a comment on the post which will have a clickable link.

 

2. Find a webpage: In a different tab in your browser, go to the webpage that you want to link to. It can be anything at all.

 

3. Open the comment box: Go to the blog post where you are leaving your comment and click on the Comment option to open the Comment box.

 

4. Type the text: Type the text you want to appear in the comment. For example, I typed this in the Comment box in the example above:

I'm adding this comment with a link to the Freebookapalooza as an example of a clickable link.

 

5. Put wickets around the link text. Now you need to decide which part of the text you typed will be the clickable part. Use a pair of greater-than/less-than signs to put what are called "wickets" around the clickable link text. Here's how I did that in the example above:

I'm adding this comment with a link to the <>Freebookapalooza<> as an example of a clickable link.

 

6. Add the "a" tags to the wickets. The "a" (anchor) tag is what you use to create a clickable link. This is a tab that is used in a pair: a starts the link, and /a closes the link. So you will put a in the first wicked, and /a in the second wicket:

<a>Freebookapalooza</a>

 

7. Add the href tag. The "href" attribute is how you create a link to an http webpage address. You will add that to the first wicket:

<a href>Freebookapalooza</a>

 

8. Create a space for the address. Next, you will define the href attribute so that it will be able to go to the address you choose. To do that, you use ="URL" like this; those quotation marks are important; don't leave them out:

<a href="/URL">Freebookapalooza</a>

 

9. Paste in the address. Now you can replace the URL with the actual webpage address you are using. For my example, that looks like this:

<a href="http://freebookapalooza.blogspot.com/">Freebookapalooza</a>

 

In the end, your comment in the comment box will now look something like this:

I'm adding this comment with a link to the <a href="http://freebookapalooza.blogspot.com/">Freebookapalooza</a> as an example of a clickable link.

 

 

After you publish the comment, it will not have any of the weird-looking HTML stuff. Instead, you should see a clickable link. Click on the link to make sure it works! (Not all Blogger templates have the preview button, but if there is a preview button, you can also use that to check and see if the HTML code you typed is working.)

 

I know that seems like a kind of complicated process, but with practice, it will become just as natural as any other kind of typing. I create HTML code like that on the fly all the time because all the writing I do is for the Internet. A little HTML goes a long way! 

 

Finishing Up: If the clickable link works in your comment on your post, you are done! Make sure you included the phrase "Tech Tip: HTML Link" in your blog post title and "Tech Tip" as the label on the post; then you can do the Declaration.

Comments (0)

You don't have permission to comment on this page.