Adding Hyperlinks to your web site

Written by eric on May 15, 2008. Posted in User Guide, Web Site Design.

The World Wide Web is a huge assortment of various web sites and documents, many of which are linked together for easy navigation from one to another by viewers. The element which creates such an interlinked connection is often referred to as a hyperlink. A hyperlink is either an image or colored text which, when clicked by a viewer, takes the viewer to another web site. In today’s post we’ll cover how to add hyperlinks to your web site.

To add a hyperlink, you use a small bit of HTML (HyperText Markup Language) code. Once you understand the HTML format required, adding a hyperlink is really quite easy… you just add the bit of code to the Body Text area of the Modification form for your WebSpawner website.

Let’s start off with a text hyperlink. The HTML code required is in the following format:

<a href=”URL”>
The Text to be displayed goes here
</a>

This particular HTML tag is called the Anchor tag. It’s really not complicated; you simply substitute in the URL address and the text to be displayed. Here is an example:

<a href=”http://www.webspawner.com”>
Create a free web site!
</a>

The line of code above will result in text displaying on your web site like this:

Create a free web site!

The text that you substitute into the ‘text to be displayed’ portion is displayed as colored clickable text, and when that colored text is clicked, it takes the viewer to the web site indicated by the URL address.

Now let’s take a look at the format for using an image as a hyperlink:

<a href=”URL”>
<img src=”URLofImage”>
</a>

Using this format, you simply substitute in the URL of the web site to which you are linking, as well as the URL address of the image that you wish to have displayed (the image must exist somewhere online… see Tips below for more information). Here is a usage example:

<a href=”http://www.webspawner.com”>
<img src=”http://www.webspawner.com/ads/freewebpages/wsanrevb.gif”>
</a>

Adding this line of code will result in a clickable image being displayed on your web site like this one:

When the image hyperlink is clicked, the viewer is then taken to the web site indicated by the URL address.

You can add hyperlinks of either type to the Body Text area of your WebSpawner web site any time you are in the Modification form.

Some closing tips: