Adding anchor links to your website

Your website may contain webpages that are quite long and require a lot of scrolling down the page. If all that information has to go on one page then it may be suitable to create anchor links within the page.

Anchor links are an easy way for website visitors to find their way around the page as they allow users to jump to a certain section rather than scrolling all the way down or up. Anchor links are commonly used for visitors to return to the top of the page.

Click on the following link to see an example of an anchor link.

Example anchor link

Adding anchor links to your website

NOTE: If you have an Edit.com website then view the video tutorial instead.

First of all decide where you want users to be able to go to in the page. For each of these sections you will need to create an anchor link, each with a unique name.

To add a new anchor link enter the following HTML code at the start of the section that you would like someone to go to (replace paragraph1 with the name of your anchor):

Now that the anchor has been added to the page you can link to it by adding the following code (replace paragraph1 with the name of the anchor):

Go to Paragraph 1

Return to top of the page

Adding anchor links with Edit.com websites

If you are an Edit.com user then adding anchor links to your website is easy.

1) Create your anchor link by clicking on the Insert Anchor button in the Web Editor
Screen shot of editing menu

2) In the popup box that appears type the name of your anchor (ie paragraph1)
Screen Shot of Anchor Properties

3) Press OK - you will see a symbol appear in the web editor showing where the anchor is located

4) Now we need to create a link to this anchor so place your cursor where the link should appear (ie top of the page) and then click on the insert link button
Screen shot of menu choosing link icon

5) In the insert Link popup that appears enter hash(#) followed by the name of the anchor you just created
Screen shot of Link box linking to anchor name

6) Press ok and repeat these steps for any additional anchor links for the page

Go to top of the page

 

 

 

 

 

 

 

 

 

Anchor Links - example

Clicking on the link at the top of the page has taken the page down to this part.

To return to the top of the page click the link below

Return to top

 

 

 


Things to consider
Webpage icon Different page layouts
Webpage icon Creating breadcrumbs
Webpage icon Spam Emails
Webpage icon Too Many Click Throughs