XSLT Examples
Practical XSLT transformation examples
📚 XSLT in Action
Learn XSLT through practical examples. These real-world scenarios show how to transform XML data into HTML, create tables, format lists, and apply styling to your content.
<!-- Simple transformation -->
<xsl:template match="/">
<h1>Welcome</h1>
</xsl:template>
Common XSLT Use Cases
XSLT transforms XML into various formats for different purposes. From creating web pages to generating reports, these examples demonstrate essential transformation patterns you'll use in real projects.
XML to HTML
Create web pages from data
Data Tables
Format data in tables
Lists
Create ordered/unordered lists
Styled Output
Add CSS styling
🔹 Example 1: Simple Book List
Transform XML book data into an HTML list:
📄 books.xml:
<?xml version="1.0"?>
<library>
<book>
<title>Learning XML</title>
<author>John Doe</author>
</book>
<book>
<title>XSLT Basics</title>
<author>Jane Smith</author>
</book>
</library>
📄 books.xsl:
<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h2>My Book Collection</h2>
<ul>
<xsl:for-each select="library/book">
<li>
<xsl:value-of select="title"/>
by <xsl:value-of select="author"/>
</li>
</xsl:for-each>
</ul>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Output:
My Book Collection
- Learning XML by John Doe
- XSLT Basics by Jane Smith
🔹 Example 2: Product Table
Create an HTML table from product data:
📄 products.xml:
<products>
<product>
<name>Laptop</name>
<price>999</price>
</product>
<product>
<name>Mouse</name>
<price>25</price>
</product>
</products>
📄 products.xsl:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h2>Product List</h2>
<table border="1">
<tr>
<th>Product</th>
<th>Price</th>
</tr>
<xsl:for-each select="products/product">
<tr>
<td><xsl:value-of select="name"/></td>
<td>$<xsl:value-of select="price"/></td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Output:
Product List
| Product | Price |
|---|---|
| Laptop | $999 |
| Mouse | $25 |
🔹 Example 3: Conditional Formatting
Apply different styles based on data values:
📄 students.xml:
<students>
<student>
<name>Alice</name>
<score>85</score>
</student>
<student>
<name>Bob</name>
<score>55</score>
</student>
</students>
📄 students.xsl:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h2>Student Scores</h2>
<xsl:for-each select="students/student">
<p>
<xsl:value-of select="name"/>:
<xsl:choose>
<xsl:when test="score >= 60">
<span style="color: green;">
<xsl:value-of select="score"/> - Pass
</span>
</xsl:when>
<xsl:otherwise>
<span style="color: red;">
<xsl:value-of select="score"/> - Fail
</span>
</xsl:otherwise>
</xsl:choose>
</p>
</xsl:for-each>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Output:
Student Scores
Alice: 85 - Pass
Bob: 55 - Fail
🔹 Example 4: Sorting Data
Sort XML data before displaying:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h2>Employees (Sorted by Name)</h2>
<ul>
<xsl:for-each select="employees/employee">
<!-- Sort by name alphabetically -->
<xsl:sort select="name"/>
<li><xsl:value-of select="name"/></li>
</xsl:for-each>
</ul>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
🔹 Example 5: Styled Page
Create a fully styled HTML page with CSS:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<head>
<style>
body { font-family: Arial; }
.card {
border: 1px solid #ddd;
padding: 15px;
margin: 10px;
border-radius: 5px;
}
.title { color: #333; font-weight: bold; }
</style>
</head>
<body>
<h1>Articles</h1>
<xsl:for-each select="articles/article">
<div class="card">
<div class="title"><xsl:value-of select="title"/></div>
<p><xsl:value-of select="content"/></p>
</div>
</xsl:for-each>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
🔹 Key XSLT Elements Used
- <xsl:for-each> - Loop through elements
- <xsl:value-of> - Extract element values
- <xsl:choose> - Conditional logic
- <xsl:when> - Condition test
- <xsl:otherwise> - Default case
- <xsl:sort> - Sort data
- <xsl:if> - Simple condition