last updated
2 years, 9 months ago

About my *PRIOR* XSLT site:

<------ NOTE: this all refers to my prior site and uses some archived "Wayback Machine" page links so you can still see the code ------>

I'm using 100% XML, XSL, and (client side) XSLT for my superneato new look. HTML is output by XSL (a language for transforming XML documents into other XML or HTML documents). I have a single HTML file for the "redirect" page here. There is just a skôtch of javascript for "mouseover" events on my time-lapses video page. But other than that, it's just XML and XSL (and of course, CSS 8-).

How this site works:

Each XML page simply contains the page-specific data as normal HTML elements inside the XML declaration. The declaration establishes to a web browser that it is XML, and then loads my styles.xsl XSL stylesheet. The XSL stylesheet outputs the top header and the left-hand navigation. Next, it "copies" all HTML from the XML as the page-specific content. Finally, the XSL stylesheet outputs the footer.

For example, this is what the source of hunter.xml looks like:

<?xml version="1.0"?>
<?xml-stylesheet rel="stylesheet" href="styles.xsl" type="text/xsl"?>
<tracey tfile="$RCSfile: xslt.php,v $"
        lastmod="$Date: 2015/05/10 05:27:34 $"
        title="chez Tracey Jaquith">

<div style="margin-top:30px; text-align: center;">
<a href="http://www.hunterleebrown.com">Hunter's Website</a>
 (he's Super!)
<img src="images/superman.jpg"
     title="Hunter is Superman"
       alt="Hunter is Superman"
     width="640px" height="480px"/>
</div>
</tracey>

That's it!
My XSL, "styles.xsl", will tell the browser how to output HTML. (NOTE: MSIEv7 requires the ' rel="stylesheet" ' in the stylesheet declaration or else it will assume your XSL is really an RSS feed and not display!) My XSL will start with the <html> tag and output the <head> and start the <body>. The body contains a main table which will:

There are some other special things I do like:

  1. Have styles.xsl "load"(!) an XML file. For example, I load quotes.xml because a random quote is used in index.xml.
  2. Generate a random number in XSL (a pseudorandom). See the top of styles.xsl to see how I finally figured a sneaky way to make a random number (to pick a random quote in index.xml, to pick a random picture in pictures.xml).
  3. Use CVS checkin special variables like "$Date: 2015/05/10 05:27:34 $" and "$RCSfile: xslt.php,v $", which get automatically updated on checkin, to allow for page-specific information in the footer (like what page you are looking at and when it was most recently updated).

But other than that, it's pretty straightforward!

You crackhead, why XML?

Some benefits:

  1. My prior website provider gave me no access to CGI (so PERL, PHP, and such were out of the question).
  2. By putting all my HTML in XML, the HTML is forced to be validated as SGML. This allows me to stay on my toes and forces me to have to output well-formed SGML/HTML!
  3. Similar to the first point, since I could not do much dynamically on the server side, I can have the client's browser (which must understand XML and XSL, which fortunately all modern browsers do and have for awhile) do the "XML + XSL" transforming for me!
  4. Viewing the source by browsing the XSL page itself with a browser is supernice as the browser does all the XML prettying, formatting, and coloring!
  5. You can avoid most Javascript in lieu of the pretty sophisticated XSL language builtins and rules once you get the hang of it.
  6. You can test and develop without a webserver running (like needed for executed CGI) -- you can just drag files to a webbrowser.

It took me about a week of "moonlighting" to learn all this and convert my site.
So please use any technique(s) you like from my site from what I've learned!

Leave a Reply

Your email address will not be published. Required fields are marked *