Creating & Changing Links


This page will provide guidance on creating links in HTML, firstly as a basic text link, and moving on to pictures. It will also help with link effects, opening in a new window and finally e-mail links which are done in a slightly different way to a standard website link.



 Return to top
Line Break



Basic Links

To do a basic clickable link in your pages and message posts, you just need to use the following code:

<a href="http://www.website address">Click Here</a>

Example:
<a href="http://www.madlassgrin.co.uk">Click Here</a>

Gives you: Click Here



 Return to top
Line Break



Named Links

You can change the wording in the above tag, so that the link has whatever name you want!

<a href="http://www.website address">Whatever Wording you choose</a>

Example:
<a href="http://www.madlassgrin.co.uk">madlassgrin.co.uk</a>

Gives you: madlassgrin.co.uk



 Return to top
Line Break



Link Effects

There are various ways in which you can change the look of your links! Here are some examples of them!

No Underline:
<a href="http://www.madlassgrin.co.uk" style="text-decoration:none">Click Here</a>

Different Colour:
<a href="http://www.madlassgrin.co.uk"><font color="#CC0099">Click Here</font></a>



 Return to top
Line Break



Picture Links

You can also use pictures as links using the following tag. Please visit my pictures Html help page for more detailed information on showing images on the internet.

<a href="http://www.website address"><img src="http://www.web address of image"></a>

Example:
<a href="http://www.madlassgrin.co.uk"><img src="http://www.madlassgrin.co.uk/images/button.jpg"></a>

Gives you: Madlassgrin Button

Note:~ The above code will automatically put a border around your picture. To avoid this include border="0" in your image tag:

<img src="http://www.Web Adress Of Image" border="0">



 Return to top
Line Break



Opening Links in a New Window

If you want to add links to your wesbite or ME page, but do not want people to loose your page, then the best option is to make the link provided open in a new browser window. This is done as follows:

<a href="http://www.website address" TARGET="_blank">Click Here</a>

Example:
<a href="http://www.madlassgrin.co.uk" TARGET="_blank">Click Here</a>

Gives you: Click Here

Note:~ This will work with any type of link, ie picture links, and will also work alongside any link effects.



 Return to top
Line Break



E-mail Links

You create links for people to click on if they want to email you. This is very handy especially for auctions, as some new eBayers won't necessarily realise that you can email through eBay.

Here's how you do it:

<a href="mailto:e-mail address here">Your Text</a>

Example:
<a href="mailto:ally@madlassgrin.co.uk">E-mail Me</a>

Gives you: E-mail Me

Note:~ This will also work as a picture link, by putting the picture HTML code into the link tag like I did previously. Here's an example for you:

Example:

<a href="mailto:ally@madlassgrin.co.uk"><img src=http://www.madlassgrin.co.uk/images/email.jpg border=0></a>

Gives you: Madlassgrin e-mail Button


Tutorial written by Ally at www.madlassgrin.co.uk



 Return to top
Line Break