XMl/XSLT/CSS Sitemap

[jaimalchohan]

take a look at my sitemap example http://trustyle.shype.co.uk/sitemap.htm

Its looks nifty, but take a look at the codeand its just piled with <img> tags. I know this could be done with XML & XSLT or CSS and reduce the code prettyrapidly, whilst keeping it SEo friendly too, but I don;t really know ow to start. I do know a basic amount of XML XSLT, but only enough to really read code, not write. If anybody has a quick second and knows how to, that would be great.

Thanks!

[RFH Customer: cswd]

Hints (this is off the top of my head so it's pseudo code):/

Create a heirarchical XML document from your site structure i.e.

<node url="/" title="test>
<node url="/products" title="Products" />
<node url="/services" title="Services">
<node url="/services/stuff" title="Stuff" />
</node>
</node>

Then create an XSLT document which basically just applies the same template a load of times (think of XSLT as a programming language rather than a markup):

<xsl:template match="node">
<!--display node here - basically and anchor inside an LI -->
<xsl:element name="A">
<xsl:attribute name="href" value="@url" />
<xsl:value-of select="." />
</xsl:element>
<xsl:if test="(XPATH: are there any nodes below this level?)">
<ul>
<xsl:apply-templates /> <!-- this just calls any subroutines(templates) on any nodes that match -->
</ul>
</xsl:if>
</xsl:template>

<ul>
<xsl:apply-templates />
</ul>

Then ... put the two together and hey presto. You'll get an unordered list out which you can style appropriately. Not only that, you have the site structure documented accurately so you can use different XSLTs to generate other navigation structures (including dynamically expanding based on where you are).

Read through the tutorials at http://www.w3schools.com/ on XPath, XSLT and XML. It's all you ever need :-)

Hope this helps.

Reply here if you need any more help.

[RFH Customer: cswd]

Sorry tabbing is screwed so it looks horrible!

[jaimalchohan]

Thanks!!