How to Create Hyperlink on Blogger Post
Well, this time I make a basic simple tutorial. For all advanced geek who read this blog, please ignore this post... I just wanna help myself not to teach the same basic thing on every newbies friends that really need help.
OK guys, back to the howto...
There are two ways to create a hyperlink on your blog post. One is the simple GUI way and the other is coders way. I prefer the coder way as I can have more control on it.
I like to teach by example. So, let say you wanna create a hyperlink on this line of words...
where you wanna link the word "here" to the other page on your blog or on the internet. In this example, I wanna link it to my Art Of Apogee Blog post with the address:
And here is how to do it using both ways...
The simple GUI way
If you rollover every button on your Compose toolbar, you can see one button called "Link" where the word Link will pop up when you hover the button like this:
Now, all you have to do is to highlight or select the word "here" on that phrase, click the link button or press Ctrl+Shift+A, type or paste the URL (the link address) and press Enter or click OK.
Pretty fast huh?... here is the slow motion...
1. Select the word "here"
2. Click on the Link Button or press Ctrl+Shift+A
3. Type or paste your link address (Um... technically it is called URL) and click OK
Believe it or not, it's done...
The Coder way
The coder way may be a bit hard for newbies who's not familiar with HTML tags. But it is good if you wanna have more control on your resulting output...
Using the same example situation, now go to the Edit Html tab. It is on the top-right of your typing area.
And using the same method, select the word, click the Link Button or press Ctrl+Shift+A, paste the URL and click OK. But now, you can see the text should look something like this:
Actually, it is basically done but I personally would love to add more things to that link code. For example, if I want a descriptive word to pop up and say "Art Of ApOgEE Blog", I can simply add this line of code:
just before the > character. And I can also add this line:
if I want my visitor to open up new window or tab if they click on that link. Very helpful for web surfer like me who don't wanna get lost from my main reading and have to click back button to reload my currently reading page...
Hey, there is more you can do with the HTML tag. You can do further reading on HTML Anchor tag and use your imagination to add more.
As usual, Here's the result of this howto:
the code:
the output:
You can go here to see my art blog
OK mates, that's all for now. Hope it helps all of you and you can start hyper linking your blog. Feel free to add a link to my blog too hehehehe...
Have Fun!!
OK guys, back to the howto...
There are two ways to create a hyperlink on your blog post. One is the simple GUI way and the other is coders way. I prefer the coder way as I can have more control on it.
I like to teach by example. So, let say you wanna create a hyperlink on this line of words...
You can go here to see my art blog
where you wanna link the word "here" to the other page on your blog or on the internet. In this example, I wanna link it to my Art Of Apogee Blog post with the address:
http://artofapogee.blogspot.com/2008/03/gimp-best-free-photoshop.htmlAnd here is how to do it using both ways...
The simple GUI way
If you rollover every button on your Compose toolbar, you can see one button called "Link" where the word Link will pop up when you hover the button like this:
Now, all you have to do is to highlight or select the word "here" on that phrase, click the link button or press Ctrl+Shift+A, type or paste the URL (the link address) and press Enter or click OK.
Pretty fast huh?... here is the slow motion...
1. Select the word "here"
2. Click on the Link Button or press Ctrl+Shift+A
3. Type or paste your link address (Um... technically it is called URL) and click OK
Believe it or not, it's done...
The Coder way
The coder way may be a bit hard for newbies who's not familiar with HTML tags. But it is good if you wanna have more control on your resulting output...
Using the same example situation, now go to the Edit Html tab. It is on the top-right of your typing area.
And using the same method, select the word, click the Link Button or press Ctrl+Shift+A, paste the URL and click OK. But now, you can see the text should look something like this:
You can go <a href="http://artofapogee.blogspot.com/2008/03/gimp-best-free-photoshop.html">here</a> to see my art blogActually, it is basically done but I personally would love to add more things to that link code. For example, if I want a descriptive word to pop up and say "Art Of ApOgEE Blog", I can simply add this line of code:
title="Art Of ApOgEE Blog"just before the > character. And I can also add this line:
target="_blank"if I want my visitor to open up new window or tab if they click on that link. Very helpful for web surfer like me who don't wanna get lost from my main reading and have to click back button to reload my currently reading page...
Hey, there is more you can do with the HTML tag. You can do further reading on HTML Anchor tag and use your imagination to add more.
As usual, Here's the result of this howto:
the code:
You can go <a href="http://artofapogee.blogspot.com/2008/03/gimp-best-free-photoshop.html" target="_blank" title=" Art Of ApOgEE Blog ">here</a> to see my art blog
the output:
You can go here to see my art blog
OK mates, that's all for now. Hope it helps all of you and you can start hyper linking your blog. Feel free to add a link to my blog too hehehehe...
Have Fun!!You may also love to read:
Comments
For example:
<a href='http://coderstalk.blogspot.com'><img src='http://coderstalk.googlepages.com/coderstalk.png/coderstalk-medium;init:.jpg'></a>
you can simply copy and paste the code, change the image and the link.
I will definitely be back for more helps as I need it. Thank you so very much. Tre, MotherEarthTreasureChest.blogspot.com
I love being able to ad the 'target=_blank' now
2 questions if I may.
1. Can I put a hyperlink in my header of my blogspot blog and if so how?
2. If I want to learn HTML/Java (knowing absolutely nothing right now) what book would you suggest?
Thanks
Barb
Tre, Thanks ;)
Kunjal, welcome ;)
Lynné, welcome, welcome, welcome :D
uh_I_dunno, welcome.. glad to hear that ;)
Shubhro, welcome ;)
The Half-Assed Housewife, you're welcome ;)
ABDURAJIK, welcome.. glad it helps you ;)
Gladys Kock, you're welcome.. thanks for loving this blog. ;)
Barbara Fowlds L.Ac., no problem... I've created new post on How to Create Hyperlink on Blogger Header to answer your first question. And for the second, I would suggest you to read http://www.w3schools.com/. That's where I started years ago.
Thanks all of you for loving this blog... Feel free to show your love by having a link to my blog. Thank you! ;)
First of all I would like to thank you Author for your teachings, learned something new :)
second) I would like to post a hyperlink on other blog sites that does not supply the link icon & I pretty much tried all of these link coding & nothing seems to work..
I've used codings..
target=blank
[link=
[a href=
[ url =
But other bloggers have created hyperlinks & it works fine.. One example blog site which I'm trying to post on is( http://www.blackeyedpeas.com/home/news/762693?msg=146#2167189 ) So can you please tell me on how I can create this special Hyperlink to work on this particular site? or similar blog commenting sites?
Your assistance will greatly be appreciated :) Thanks!
I however can't find the following code in the html template after which to place you code.
What do I do?