HTML L*^%$

Hello!
Greetings bloggers and other people who get to this blog via random search words on Google.
To figure out today's subject you are going to have to click here.


































































































































Click here to test a link that doesn't open a new window.


















































































































































































Linking! (But maybe you could guess that from the post title...)

src

How it works

I have mentioned the <a> tag a couple of times now and figured that we could do with a little demonstration of some of the things it can do... 

The code I used above to get you all the way down here was:

a) <a href="http://takesomecode.blogspot.com/2012/03/greetings-bloggers-and-other-people-who.html#allthewaydown">Here</a>

(The link that you clicked...)

and

b) <span id="allthewaydown">Linking! (But maybe yo.......)</span>

(The spot the link took you to...)

src

While you probably already utilize the <a> tag on your blog, you might not have known about the possibility of using it like I did.

The <a> tag can provide hyper-linking not only to other pages, but also within the same page or other pages.

Here is how it's done in a step-by-step guide:

*If you want to have a post with any code you'll need to edit the HTML of the post and add it there...

1) First you need to have the spot you want it to link to. I used the <span> tag to do this but you can also use the <img>, <div>, <a>, and many other HTML tags. The key is in assigning that tag a particular value as an "id" as I did.

<span id="allthewaydown"></span>

While a variety of characters can be used it is best to keep it simple with lowercase letters and no numerals. Numerals can't be used at the beginning of the phrase anyway so I tend to do without them as much as I can.

2) Place whatever title or image you wanted to link to in between the <span> (<img>, <div>) tags.

<span id="allthewaydown"> WHATEVER YOU ARE LINKING TO </span>

3) Create the link using the <a> tag.

Here is the formula for links: Whatever page contains the stuff you're linking to + # + the id name.

So...

<a href="blahblahblah#allthewaydown">Word to click</a>

4) Decide whether or not to have the link open in another page.

Use good judgement with this as many users might become frustrated if every link they click on your site results in a new window or tab. If you want the link to open in a new tab or window simply include: target="_blank" inside of the <a> tag.

<a href="blahblahblah" target="_blank">Words used for link</a>

5) Done. Be sure to test all your links that way users don't encounter any errors.

For an example of opening another window or tab click here.

For another in page example click here.

For easy to use code click here.

Thanks for reading!

Enjoy the code!

As always please leave a comment if you have any questions or requests for code!

-Mike @ Take Some Code

P.S. What do you think of my blog button? Pretty cool eh? (hold mouse over it)