Výstup RSS kanálu v HTML formáte pomocou XSLT a PHP

RSS kanál v dnešnej dobe nie je žiadnou zriedkavosťou a nájdeme ho takmer na každom dobrom webe. Samozrejme iba vtedy ak je ho tam treba. RSS kanál si je možné naštýlovať za pomoci technológie XSLT.

Aby sme mohli vypracovať výstup kanálu budeme musieť skontrolovať či PHP obsahuje extension XSL. Ďalej budeme potrebovať jeden XML súbor, ktorý bude mať zachovanú štruktúru pre RSS (jeden taký si uvedieme v príklade). Ďalej si budeme musieť vytvoriť XSL súbor, ktorý bude pre daný XML súbor fungovať ako štýl.

Príklad XML (rss štruktúra) súboru:

<rss version='2.0'>
<channel>
<title>Titulok</title>
<link>http://localhost/tpl/</link>
<description>rss kanál pre Titulok</description>
<language>sk</language>
<lastBuildDate>Fri, 03 Feb 2006 14:36:25 GMT</lastBuildDate>
<image>
<title>obrázok</title>
<url>http://localhost/tpl/template.jpg</url>
<link>http://localhost/tpl/</link>
</image>

<item>
<title>Článok 3</title> 
<link>http://localhost/tpl/clanok-3/</link> 
<description>
Lorem ipsum dolor sit amet consectetuer id nibh Vestibulum nibh at. Senectus
gravida laoreet Cras pede convallis et id nibh consequat et. Libero parturient
Curabitur interdum arcu nunc id vel Vivamus a condimentum. Sed Vivamus turpis
montes nulla Proin Pellentesque sodales arcu pede ligula. Vestibulum elit ipsum
odio Nulla porttitor. Nibh sem elit nibh vestibulum sed vitae ac pretium Morbi
libero. Et gravida eros magna est et Aliquam lacus ut pede Quisque. Augue cursus
leo enim orci at accumsan tortor ligula Sed libero. Tortor orci sed Vivamus Nam
cursus eu rhoncus Phasellus habitasse nascetur. Pretium adipiscing auctor
lobortis at justo et pretium velit Aenean adipiscing. Condimentum dignissim eu.
</description> 
<pubDate>Sat, 03 Dec 2005 18:49:55 GMT</pubDate>
</item>

<item>
<title>Článok 2</title> 
<link>http://localhost/tpl/clanok-2/</link> 
<description>
Lorem ipsum dolor sit amet consectetuer id nibh Vestibulum nibh at. Senectus
gravida laoreet Cras pede convallis et id nibh consequat et. Libero parturient
Curabitur interdum arcu nunc id vel Vivamus a condimentum. Sed Vivamus turpis
montes nulla Proin Pellentesque sodales arcu pede ligula. Vestibulum elit ipsum
odio Nulla porttitor. Nibh sem elit nibh vestibulum sed vitae ac pretium Morbi
libero. Et gravida eros magna est et Aliquam lacus ut pede Quisque. Augue cursus
leo enim orci at accumsan tortor ligula Sed libero. Tortor orci sed Vivamus Nam
cursus eu rhoncus Phasellus habitasse nascetur. Pretium adipiscing auctor
lobortis at justo et pretium velit Aenean adipiscing. Condimentum dignissim eu.
</description> 
<pubDate>Sat, 03 Dec 2005 15:39:55 GMT</pubDate> 
</item>

<item>
<title>Článok 1</title> 
<link>http://localhost/tpl/clanok-1/</link> 
<description>
Lorem ipsum dolor sit amet consectetuer id nibh Vestibulum nibh at. Senectus
gravida laoreet Cras pede convallis et id nibh consequat et. Libero parturient
Curabitur interdum arcu nunc id vel Vivamus a condimentum. Sed Vivamus turpis
montes nulla Proin Pellentesque sodales arcu pede ligula. Vestibulum elit ipsum
odio Nulla porttitor. Nibh sem elit nibh vestibulum sed vitae ac pretium Morbi
libero. Et gravida eros magna est et Aliquam lacus ut pede Quisque. Augue cursus
leo enim orci at accumsan tortor ligula Sed libero. Tortor orci sed Vivamus Nam
cursus eu rhoncus Phasellus habitasse nascetur. Pretium adipiscing auctor
lobortis at justo et pretium velit Aenean adipiscing. Condimentum dignissim eu.
</description> 
<pubDate>Sat, 03 Dec 2005 15:49:55 GMT</pubDate> 
</item>
</channel> 
</rss>

Príklad XSL šablóny pre predchádzajúci RSS kanál:

<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>
        <link rel='stylesheet' href='template.css' type='text/css' media='all' />
        <title><xsl:value-of select='rss/channel/title'/></title>
      </head>
      <body>
        <xsl:apply-templates/>
      </body>
    </html>
  </xsl:template>
  <xsl:template match='channel'>
    <xsl:param name='abs-url' select='link'/>
    <xsl:param name='img-src' select='image/url'/>
    <xsl:param name='img-link' select='image/link'/>
    <div id='head'>
      <h1><xsl:value-of select='title'/></h1>
      <div id='info'>
        <div>
          <a href='{$img-link}' title='Logo'><img src='{$img-src}' alt='Logo' /></a>
        </div>
        <xsl:value-of select='description'/>
      </div>
    </div>
    <xsl:for-each select='item'>
      <xsl:param name='name' select='title'/>
      <xsl:param name='url' select='link'/>
      <div class='item'>
        <h2><a href='#head' title='na vrch'>Δ</a> <xsl:value-of select='title'/></h2>
        <a href='{$url}' title='{$name}'><xsl:value-of select='link'/></a>
        <p><xsl:value-of select='description'/></p>
        <span><xsl:value-of select='pubDate'/></span>
      </div>
    </xsl:for-each>
  </xsl:template>
</xsl:stylesheet>

Pridáme CSS štýl:

* { margin:0; padding:0; }
html, body { font-family:'Trebuchet MS', sans-serif; font-size:1em; padding:0.5em 1em 0.5em 1em; color:#444444; }
a { font-weight:bold; padding:0.1em; }
a:link    { color:#003366; text-decoration:underline; }
a:visited { color:#003366; text-decoration:underline; }
a:hover   { color:#ffffff; background:#003366; text-decoration:none; }
a:active  { color:#003366; text-decoration:underline; }
img { border:0; }

div#head { border:0.25em solid #003366; }
div#head h1 { padding:0.2em; color:#ffffff; font-weight:bold; background:#003366; }
div#head div#info { padding:0.5em 1em 0.5em 1em; }
div#head div#info div { text-align:center; }

div.item { cursor:default; padding:0 0 1em 0; margin:1em 0 1em 0; }
div.item:hover { color:#000000; background:#f2f2f2; }
div.item h2    { font-size:1.2em; padding:0.2em 0.5em 0.2em 0.5em; border:1px solid #cccccc; background:#003366; color:#ffffff; margin-bottom:0.5em; }
div.item h2 a  { color:#ffffff ! important; }
div.item p     { text-align:justify; margin-top:0.5em; }
div.item span  { float:right; font-weight:bold; }

PHP súbor, ktorý zabezpečí viazanie XML a XSL. Súbory je možné viazať aj cez zápis

<?xml-stylesheet...
ale nepoužijeme ho, pretože tento príklad zahrňuje aj použite jazyka PHP.

<?php

$xml = new DOMDocument;
$xml->load('template.xml');
$xsl = new DOMDocument;
$xsl->load('template.xsl');

$convert = new XSLTProcessor;
$convert->importStyleSheet($xsl);

echo $convert->transformToXML($xml);

?>

Výsledok si môžete prezrieť na tejto adrese. Výhodou takéhoto štýlovania je funkčnosť zobrazenia v každom prehliadači. Hlavný cieľ príkladu bol kladený hlavne na princíp funkčnosti technológie XSLT. XML štruktúra RSS bola uvedená len ako príklad využitia.

Najlepší manuál na XSLT nájdete na adrese:
http://www.kosek.cz/xml/xslt/

08.02.2006 07:00

PaBi3

Programovanie