"Back to top" link using template names

papo3 · December 1st, 2007, 08:21 AM

Hello,
At the end of my html page I want to add the hyperlink "back to the top" that points to the top of the page.
I want to do this using the xsl:call-template element.

I guess i have to use sth like that in my stylesheet :

<xsl:template match="/">
        <xsl:call-template name="top"/>
        <xsl:apply-templates/>
        <xsl:call-template name="bottom"/>
  </xsl:template>

  <xsl:template name="bottom">
    <xsl:text>This is the bottom of the page</xsl:text>
  </xsl:template>

  <xsl:template name="top">
    <xsl:text>This is the top of the page</xsl:text>
  </xsl:template>

But how do I integrate the hyperlink, and where do I put it in the stylesheet? Has anyone a complete xsl stylesheet example with that?

Martin Honnen · December 1st, 2007, 08:51 AM

If you want to generate a HTML document with your XSLT stylesheet then you should make sure you have the proper HTML document structure with a html root element containing a head and a body element:

Code:

<xsl:template match="/">
  <html lang="en">
    <head>
      <title>document title</title>
    </head>
    <body>
      <xsl:call-template name="top"/>
      <xsl:apply-templates/>
      <xsl:call-template name="bottom"/>
    </body>
  </html>
</xsl:template>

<xsl:template name="top">
<div id="t">This is the top of the page.</div>
</xsl:template>

<xsl:template name="bottom">
  <a href="#t">go to top</a>
</xsl:template>

papo3 · December 1st, 2007, 09:22 AM

Quote:

quote:Originally posted by Martin Honnen
If you want to generate a HTML document with your XSLT stylesheet then you should make sure you have the proper HTML document structure with a html root element containing a head and a body element:

Code:

<xsl:template match="/">
  <html lang="en">
    <head>
      <title>document title</title>
    </head>
    <body>
      <xsl:call-template name="top"/>
      <xsl:apply-templates/>
      <xsl:call-template name="bottom"/>
    </body>
  </html>
</xsl:template>

<xsl:template name="top">
<div id="t">This is the top of the page.</div>
</xsl:template>

<xsl:template name="bottom">
  <a href="#t">go to top</a>
</xsl:template>

Thank you.
But at which places exactly do I integrate this code into my stylesheet?
I want the "back to top" link to point to the title: <title>Outils XML</title>

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:output method="html"
encoding="utf-8"/>

<xsl:template match="/">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Outils XML</title>
</head>

<body>

<h2>Outils XML</h2>
    <table border="1">
    <tr>
        <th>Nom</th>
        <th>Auteurs</th>
        <th>Licence</th>
        <th>TÃ©lÃ©chargement</th>
        <th>Commentaire</th>
    </tr>
    <xsl:for-each select="ListeOutils/outil">

<tr>
    <td><xsl:value-of select="nom"/></td>
    <td><xsl:value-of select="auteurs"/></td>
    <td><xsl:value-of select="licence"/></td>
    <td><xsl:value-of select="tÃ©lÃ©chargement"/></td>
    <td><xsl:value-of select="commentaire"/></td>
</tr>

     </xsl:for-each>
</table>

</body>
</html>

</xsl:template>

</xsl:stylesheet>

Martin Honnen · December 1st, 2007, 09:59 AM

In my view a link to the title element does not make sense as the title is not rendered as part of the document. You need to link to an element inside of the body section of the HTML document. So you could link to that h2 element by giving it an id attribute value:

Code:

<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:output method="html"
encoding="utf-8"/>


<xsl:template match="/">


<html lang="fr">
<head>
<title>Outils XML</title>
</head>

<body>

<h2 id="t">Outils XML</h2>
    <table border="1">
    <tr>
        <th>Nom</th>
        <th>Auteurs</th>
        <th>Licence</th>
        <th>TÃ©lÃ©chargement</th>
        <th>Commentaire</th>
    </tr>
    <xsl:for-each select="ListeOutils/outil">

<tr>
    <td><xsl:value-of select="nom"/></td>
    <td><xsl:value-of select="auteurs"/></td>
    <td><xsl:value-of select="licence"/></td>
    <td><xsl:value-of select="tÃ©lÃ©chargement"/></td>
    <td><xsl:value-of select="commentaire"/></td>    
</tr>    

     </xsl:for-each>  
</table>

<xsl:call-template name="bottom"/>
</body>
</html>
 
</xsl:template>

<xsl:template name="bottom">
  <a href="#t">go to top</a>
</xsl:template>

</xsl:stylesheet>

papo3 · December 1st, 2007, 10:30 AM

Quote:

quote:Originally posted by Martin Honnen
In my view a link to the title element does not make sense as the title is not rendered as part of the document. You need to link to an element inside of the body section of the HTML document. So you could link to that h2 element by giving it an id attribute value:

Code:

<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:output method="html"
encoding="utf-8"/>


<xsl:template match="/">


<html lang="fr">
<head>
<title>Outils XML</title>
</head>

<body>

<h2 id="t">Outils XML</h2>
    <table border="1">
    <tr>
        <th>Nom</th>
        <th>Auteurs</th>
        <th>Licence</th>
        <th>TÃ©lÃ©chargement</th>
        <th>Commentaire</th>
    </tr>
    <xsl:for-each select="ListeOutils/outil">

<tr>
    <td><xsl:value-of select="nom"/></td>
    <td><xsl:value-of select="auteurs"/></td>
    <td><xsl:value-of select="licence"/></td>
    <td><xsl:value-of select="tÃ©lÃ©chargement"/></td>
    <td><xsl:value-of select="commentaire"/></td>    
</tr>    

     </xsl:for-each>  
</table>

<xsl:call-template name="bottom"/>
</body>
</html>
 
</xsl:template>

<xsl:template name="bottom">
  <a href="#t">go to top</a>
</xsl:template>

</xsl:stylesheet>

Thank you so much!!