Some Tricks for making links in Blogger Posts

Creating links in blogger is very easy. There is a link Option in our WYSIWYG Editor.When you use this option you can easily add a new link. Now to see the Code of this link just clisk on the Edit Html Option on your Editor[See image for details]

There you will see something like

<a href="The UrL">The Text</a>



Additional Options

1.Open The link in New Window

To open the link in a new window,add the target="_blank" option to your link so that the code becomes something like

<a href="The UrL" target="_blank">The Text</a>

2.Adding a Relation attribute

Relation attribute can be specified by adding the rel="relation"

The relation attribute is used to specify the relation of the link to the our post. One commonly used relation is external which specifies that the link is a link to an external page

<a href="The UrL" rel="external">The Text</a>

The external relation is not much useful to us.But there is yet another one,

rel="nofollow" - When we add this to a link,we specify the search engines that they shouldn't go exploring this link url from our post page.This thing is important.Having too many links[especially to external pages] is not good for Search Engine Optimization. So if you link to some external website use the rel="nofollow" option

<a href="The UrL" rel="nofollow">The Text</a>

[Note:Don't use the rel="nofollow" option when you are giving credit to the original author of an article that you use in your blog.They deserve to be followed by the search Engines :)]

3.Adding the Title Attribute

If you add a title attribute to a link,then if someone hovers his mouse over that link,the title will be displatyed as a description of the link.

<a href="The UrL" title="The Title">The Text</a>

As an example try doing a hover over the next link[W3Schools] it will display Title of the link to W3 Schools.This is beacuse i have given this text as the tilte attribute of that link

To know more about the different attributes available for links visit W3Schools . Its the best place for a beginner.

4.Remove Underlining of a link

In some blogger templates,the links within the posts may be underlined. To remove the underlining you can use the style attribute - text-decoration:none

<a href="The UrL" style="text-decoration:none;">The Text</a>

5.List of Links

If you want to use a list of links ,then you should use the<ul> <ol> and <li tags

<ul> stands for unordered list and <ol> stands for ordered list.:( What does this mean??

Ordered list means the list of links will be numbered. Here is the demo

Ordered List Demo
  1. URL NAME 1
  2. URL NAME 2
  3. URL NAME 3
Ordered List Code
<ol>
<li><a href="URL_1">URL NAME 1</a></li>
<li><a href="URL_2">URL NAME 2</a></li>
<li><a href="URL_3">URL NAME 3</a></li>
</ol>

To change this to an unordered list,i.e without numbering, just change <ol> to <ul> and </ol> to </ul>

You can also use the ordered and unordered lists for arranging normal text[other than links]

18 comments :

  1. Great way, but I use Windows Live writer and all this coding edit stuff in not required there.... try it too :)

    ReplyDelete
  2. @Prasannajeet™ i too sometimes use Live Writer.. It has got a very nice interface..

    ReplyDelete
  3. So far, I've used most of the link tricks specified. Though rel and style is something new to me. It really is fairly easy to do, isn't it? Thanks for sharing the info. :)

    ReplyDelete
  4. yea it is easy.. will get easier if you use Live Writer as Prasannajeet™ mentioned

    ReplyDelete
  5. hi,

    can you tell me how can i list posts by author, in blogger ?

    tnx

    ReplyDelete
  6. I've been with HTML for a long time but I haven't learned anything like this before. Thanks!

    ReplyDelete
  7. The rel="nofollow" trick was really helpful, didnt know that it had such an impact...Thanks again.....

    ReplyDelete
  8. To add links in my own way was also a problem for me. Thanks to your tiny codes, now I can add links as I want.

    ReplyDelete
  9. Good job ! Very Useful Tips .Thanks

    ReplyDelete
  10. Thanks a lot. I benefited a lot from this post.

    ReplyDelete
  11. thank you very much..

    ReplyDelete
  12. Amazing tips! Thank you veeeeeery much!!!!!!

    ReplyDelete