Design options ...

Design Options

Changes effect all users.

Developer:
Theme:
Components:

XslWebMaker - Basics

First Published (Original Date):
2005-11-09%
Datetime Format:
EDTF with spaces.

Basic Steps

  1. Author your .html files. (and supporting .css, .jpg, etc.) source files
  2. Edit xwmToXhtml.xslt
  3. Edit make.bat
  4. Run make.bat to transform your files (leaving source files intact) to ~\MyWebSiteProjects\MyWebSite\WebOut\

Author your .html files

It might be easiest if you use the sample .html files and edit these with your content. Observe that these are not quite XHTML files (they are XML). They are peppered with elements from the urn:xslwebmaker:toxhtml namespace. That is, elements with a "xwm" prefix.

Most of these XslWebMaker elements are simple place holders that allowing repeating code, such as navigation menus, to dropped in to the file from xwmToXhtml.xslt

Steps to customize your .html files

  1. Change the namespace to something unique to you. You will want this namespace to be identical in all your website's pages. You may well make it unique for all your websites. 
    <html xmlns="http://www.w3.org/1999/xhtml" 
xmlns:xwm="urn:xslwebmaker:toxhtml" 
xml:lang="en">
to
<html xmlns="http://www.w3.org/1999/xhtml" 
xmlns:xwm="urn:xslwebmaker:lisasimpson" 
xml:lang="en">
  2. Add your page specific content. 
    <body>
<h1>A new world order</h1>
<p>For global justice it is necessary to give a democratised United Nations 
an independant military force that is larger than that of the United States.</p>

<p>40% of each countries' budget on national defence can be taxed to fund it.
</p>
...
  3. Add xwm prefixed elements for text (or images, etc) that you want repeated across several pages. 
    <body>
<xwm:myLogo />  
<h1>A new world order</h1>
...
    Or 
    <body>
<xwm:myLogo>
You can put mnemonic text here but it gets overwritten.
</xwm:myLogo>  
<h1>A new world order</h1>
...
  4. Any inline script should not have a src attribute. In xwmToXhtml.xslt such script is escaped properly with CDATA. 
    // Good
<script type="text/javascript" src="myScript.js"></script>
<script type="text/javascript">
/* <![CDATA[ */

/* ]]> */
</script>

    // Bad
<script type="text/javascript" src="myScript.js">
/* <![CDATA[ */

/* ]]> */
</script>

Customizing xwmToXhtml.xslt - Basics

xwmToXhtml.xslt defines how your source files will be transformed. Knowing XSL (XSLT and XPATH) will give you complete control. However you don't have to know this skill at all because a few straight forward customizations are available in xwmToXhtml.xslt. You can just copy the examples.

xwmToXhtml.xslt has two sections. A top section which takes care of standard transformations (largely an identity transformation). The bottom section, after ...

<!-- *********** Website specific below here ******************** -->

Customizations mostly occur below that line.

For example, to insert repeating text in your source .html files ...

<xsl:template match="*[local-name()='myLogo']" xml:space="preserve">
<div class="logo">
Floppy Jallopy.
</div></xsl:template> <!-- </xsl:template> here to reduce new lines in output -->

... this will replace all occurences of <xwm:myLogo></xwm:myLogo> in your source .html files.