Links

Learn how to create links on your ECEn XML web pages.

A link looks and behaves differently than most of the text on the web page, so we might say that a link is special text. In the ECEn XML templates, we use the <special-text> tag for links and other kinds of special text on web pages.

These instructions assume that you already have a ECEn XML web page to edit and know at least a bit about XML. Most content, such as text, links, lists, pictures etc., belong in the <content> portion of your page, so make sure that you have a page with a <content> portion. If you need a quick tutorial or just a simple starter web page download, check out the Howdy, World Tutorial where you can get brief overview on what files you need to set up a basic ECEn XML web page.

If you need an example, have a look at the Links Example page. You can view the XML source in your by clicking the 'this XML' at the bottom of the page. Or, the XML source located in the Common Tasks Downloads to the right. (Right click, Save Link Target As...)

Basic Links

Here is some "code" for a basic link, ECEn XML templates style:

<special-text>

<text>BYU</text> <related-page>http://www.byu.edu/<related-page>

</special-text>

Here is what the sample link would look like on an ECEn XML web page:

BYU

To create a link:

1	Create an opening and closing `<special-text>` tag.

2	Place a `<text>` tag between the `<special-text>` tags. Inside the `<text>` specify the link text you want to appear on you web page.

3	Place a `<related-page>` tag after the `<text>` tags. Inside the `<text>` tag specify the where the link should point to, in other words, its related page.

Just as every other web page, links on ECEn XML web pages can be relative or absolute.

Links to a particular place on a page

Sometimes, especially when a particular web page is long, we'd like a link to point to a particular place on a web page. In the ECEn XML, you can do this with the <special-text> tag, a <related-page> and a <related-section> tag.

Links that point to a particular place on a page are often known as anchors.

To create a link to a particular place on a page:

In the XML file you'd like to link to, or your related page, create a named section.
You can do this by placing a <name> tag within any section in the page you'd like to link to.
If you know HTML, you can use the <related-section> tag to point to an anchor in an HTML file. Simply specify the name of the anchor within the <related-section> tags.

2	Back in the XML page where you'd like the link to appear, create `<special-text>` , `<related-page>` and `<text>` tags, just as with a basic link.

3	After the `<related-page>` tags, add a `<related-section>` tag, and within it specify the name of the section on the related page you wish you link to. If your related-page points to a directory, specify the file within it. For example instead of 'foo', specify 'foo/index.phtml'.

Links to an email address

Creating a link to send somebody email is a lot like creating a basic link. You still need the <special-text> and <text> tags. However, instead of the <related-page> tag, you'll use the <related-email-address> tag.

To create a link to an email address:

1	Just as with a basic link, create `<special-text>` and `<text>` tags.

2	Create `<related-email-address>` tags. Specify the email address within them.

Links within pictures

Just as special text can have a related-page, so can pictures. Here some "code" to create a link within a picture:

<picture>

<file>plain_clyde_halfsize.png</file> <related-page>http://www.ee.byu.edu/</related-page>

</picture>

Here is what the picture link would look like on your ECEn XML web page:

To create a link within a picture:

1	Create an opening and closing `<picture>` tag.

2	Within the `<picture>` tags, create `<file>` tags. Within them, specify the name of your picture file.

3	Below the `<file>` tags, create `<related-page>` tags. Within them, specify the name of the page you'd like the picture to link to.