Internal Links

Contact Us or call 1-877-932-8228
Internal Links

Internal Links

Internal links are links from one location in a document to another location in the same document. There are two steps to creating internal links:

  1. Give a unique ID to the location being linked to. IDs are specified with the id attribute. The value can be hard coded or generated. In the example below, we use the generate-id() XSLT function to generate IDs:
    <fo:block font-weight="bold" font-size="larger" 
    	id="{generate-id(.)}" break-before="page">
    		<xsl:value-of select="."/>
    	</fo:block>
  2. Create the link to that location. As with external links, internal links are created with the <fo:basic-link> tag. The internal-destination attribute should be set to the value of an ID elsewhere in the document.
    <fo:basic-link internal-destination="{generate-id(.)}">
    	<xsl:value-of select="."/>
    </fo:basic-link>

The complete example is below:

Code Sample:

LinksAndGraphics/Demos/Stories.html
<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="Stories.xsl"?>
<html>
	<head>
		<title>Stories</title>
		<link href="Styles.css" rel="stylesheet" type="text/css" />
	</head>
	<body>
		<a name="top"></a>
		<h1>Stories</h1>
		<hr />
		<div id="divPooh">
			<a name="pooh" />
			<h2>POOH GOES VISITING - A.A. Milne</h2>
			<p>Pooh always liked a little something at eleven o'clock in the morning,
---- C O D E   O M I T T E D ----
</div>
		<div id="divTea">
			<a name="alice"></a>
			<h2>A MAD TEA-PARTY - Lewis Carroll</h2>
			<p>There was a table set out under a tree in front of the house, and the 
---- C O D E   O M I T T E D ----
</div>
		<div id="divCupid">
			<a name="naughtyboy"></a>
			<h2>THE NAUGHTY BOY - Hans Christian Andersen</h2>
			<p>Along time ago, there lived an old poet, a thoroughly kind old poet.
---- C O D E   O M I T T E D ----
</div>
	</body>
</html>

Code Sample:

LinksAndGraphics/Demos/Stories.xsl
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" 
			xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
			xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:output method="xml" indent="yes"/>
<xsl:template match="/">
	<fo:root xmlns:fo="http://www.w3.org/1999/XSL/Format">
		<fo:layout-master-set>
---- C O D E   O M I T T E D ----
</fo:layout-master-set>
		<fo:page-sequence master-reference="TOC">
			<fo:static-content flow-name="xsl-region-before">
				<fo:block border-bottom-width="thin" 
					border-bottom-style="solid" border-bottom-color="green"
					font-weight="bold">
					Table of Contents
				</fo:block>
			</fo:static-content>
			<fo:flow flow-name="xsl-region-body">
				<xsl:apply-templates mode="TOC"/>
			</fo:flow>
		</fo:page-sequence>
		<fo:page-sequence master-reference="Stories">
			<fo:static-content flow-name="xsl-region-before">
				<fo:block border-bottom-width="thin" 
					border-bottom-style="solid" border-bottom-color="green"
					font-weight="bold">
					Story
				</fo:block>
			</fo:static-content>
			<fo:flow flow-name="xsl-region-body">
				<xsl:apply-templates mode="Stories"/>
			</fo:flow>
		</fo:page-sequence>
	</fo:root>
</xsl:template>
<xsl:template match="body/div/h2" mode="TOC">
	<fo:block font-weight="bold" font-size="larger">
		<fo:basic-link internal-destination="{generate-id(.)}">
			<xsl:value-of select="."/>
		</fo:basic-link>
	</fo:block>
</xsl:template>
<xsl:template match="body/div/h2" mode="Stories">
	<fo:block font-weight="bold" font-size="larger" 
		id="{generate-id(.)}" break-before="page">
		<xsl:value-of select="."/>
	</fo:block>
</xsl:template>
<xsl:template match="body/div/p" mode="Stories">
	<fo:block margin-top="12pt">
		<xsl:apply-templates mode="Stories"/>
	</fo:block>
</xsl:template>
<xsl:template match="head | h1 | a | p" mode="TOC"/>
<xsl:template match="head | h1 | a" mode="Stories"/>
</xsl:stylesheet>

The document being transformed is Stories.html, an HTML document containing several children's stories. The XSLT, Stories.xsl, transforms the HTML document into a FO document with two page sequences: one for a rudimentary table of contents containing the story titles and the other for the stories themselves. The output is shown below with the links and headings called out.

Next