Blogmarks to Html conversion
1 2 <?xml version="1.0" encoding="utf-8"?> 3 <xsl:stylesheet version="1.0" xmlns:atom="http://purl.org/atom/ns#draft-ietf-atompub-format-05" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:dc="http://purl.org/dc/elements/1.1/"> 4 <xsl:output method="html" /> 5 <xsl:template match="/"> 6 <xsl:apply-templates select="/atom:feed/atom:head" mode="before" /> 7 <xsl:apply-templates select="/atom:feed/atom:entry" /> 8 <xsl:apply-templates select="/atom:feed/atom:head" mode="after" /> 9 </xsl:template> 10 <xsl:template match="atom:feed/atom:head" mode="before" > 11 <!-- <h3><xsl:value-of select="atom:title" /></h3> --> 12 </xsl:template> 13 <xsl:template match="atom:feed/atom:head" mode="after"> 14 <p><a href="{atom:link[@rel='alternate']/@href}"><img src="http://blogmarks.net/img/88x31_neg.png" alt="blogmarks.net" /></a></p> 15 </xsl:template> 16 <xsl:template match="atom:feed/atom:entry"> 17 <div> 18 <xsl:choose> 19 <xsl:when test="position() mod 2 = 1"> 20 <xsl:attribute name="class">bm_blogmarks bm_odd</xsl:attribute> 21 </xsl:when> 22 <xsl:otherwise> 23 <xsl:attribute name="class">bm_blogmarks bm_even</xsl:attribute> 24 </xsl:otherwise> 25 </xsl:choose> 26 <a href="{atom:link[@rel='related']/@href}"><img src="{atom:link[@rel='image']/@href}" alt="" /></a> 27 <h4><a href="{atom:link[@rel='related']/@href}"><xsl:value-of select="atom:title" /></a></h4> 28 <p><xsl:value-of select="atom:summary" disable-output-escaping="yes" /></p> 29 <p class="blogmarks-tags"> 30 <xsl:value-of select="substring(atom:published, 0, 11)" /> 31 <xsl:if test="atom:category"> 32 <xsl:for-each select="atom:category"> 33 <xsl:text> - </xsl:text><a href="{@term}{@sheme}"><xsl:value-of select="@label" /></a> 34 </xsl:for-each> 35 </xsl:if> 36 </p> 37 </div> 38 </xsl:template> 39 </xsl:stylesheet>
The generated html is inspired by the one used on Hot Links (http://dev.upian.com/hotlinks/). It can be styled with the following css:
1 2 .bm_blogmarks { 3 margin: 10px auto; 4 padding: 1%; 5 background-color: #f5f5f5; 6 border: 1px solid #d9d9d9; 7 width: 97%; 8 overflow:auto; 9 } 10 .bm_even { 11 background-color: #fcfcfc; 12 } 13 .bm_blogmarks h4 { 14 margin-top: 0; 15 } 16 .bm_blogmarks p.bm_tags { 17 margin-bottom: 0; 18 display: block; 19 clear: left; 20 } 21 .bm_blogmarks img { 22 margin: 0 0px 5px 10px; 23 float: right; 24 border: 0; 25 clear: none; 26 width: 144px; 27 height: 107px; 28 } 29 .bm_even img { 30 margin: 0 10px 5px 0px; 31 float: left; 32 }