Getting started

There's a little example in the distribution, which takes an RSS feed and displays this as HTML and makes it editable. The best thing is, you have a look at this, if you want to implement BXe into your project.

For implementing BXE, it needs mainly 3 things. An XML document with the content, a XSLT stylesheet with the rendering information and a RelaxNG file with the validation information. It furthermore needs a config.xml, but usually you can take the one from the example and just do some simple adjustements for a start. The config.xml format is described at Config.xml in more detail.

The XML File

This is a standard XML file, it can contain namespaces and entities, but the entities have to be declared somewhere (and they are resolved during startup).

Be aware, that BXE only sends UTF-8 back. You can send whatever charset you have to BXE (as long as you define it properly in the XML header, but back comes always UTF-8. This is a limitation of Mozilla (or at least, we didn't find out, how to circumvent that)

The XSLT File

The XSLT processor of Mozilla understands almost the complete XSLT specs. But we have to transform your XSLT to insert some "tracking nodes" to another XSLT. This transformation can't currently catch every possible XSLT instruction. This doesn't mean, that the actual transformation will fail later, but that we can't correctly track the nodes from the produced HTML document back to the XML document.

Basically, BXE looks for xsl:value-of and xsl:apply-templates. Here are some examples from the RSS example, which work perfectly:

{panel}
 <xsl:template match="channel/title">
   <h1>
      <xsl:value-of select="."/>
   </h1>
 </xsl:template>
{panel}

{panel}
 <xsl:template match="content:encoded">
  <p class="content">
    <xsl:apply-templates/>
  </p>
 </xsl:template>
{panel}

{panel}
 <xsl:template match="xhtml:*">
  <xsl:element name="{local-name()}">
   <xsl:apply-templates/>
  </xsl:element>
 </xsl:template>
{panel}

Displaying content of attributes and edititing them is also possible:

{panel}
 <xsl:template match="media">
  <div class="media-caption">
    <xsl:value-of select="@caption"/>
  </div>
 </xsl:template>
{panel}

Limitations

What doesn't work is computed values, for example <xsl:value-of select="concat(firstname, lastname)"/> wouldn't be correctly editable.

Also mixing apply-templates and text does not work work, if the corresponding template doesn't add elements.
BXE needs elements around text nodes to properly being able to track these nodes. BXE does add them on xsl:value-of instructions, but not on xsl:apply-templates. In short, it's mainly a problem, if you use xsl:apply-templaes without having a matching xsl:tempalte.

The following example wouldn't work. It would also not work, if we don't have a matcher for the title element at all, because then the XSLT processor simple outputs the text node and therefore no element for bxe to track this.

{panel}
   <!-- DOES NOT WORK -->
   <xsl:template>
      <h1>
        Titel: <xsl:apply-templates select="title"/>
      </h1>
   </xsl:template>
{panel}

   <xsl:template match="title">
{panel}
     Output of something without elements and xsl:value-of
   </xsl:template match>
{panel}

But the following does work:

{panel}
   <!-- DOES  WORK -->
   <xsl:template>
      <h1>
        Titel: <xsl:apply-templates select="title"/>
      </h1>
   </xsl:template>
{panel}

   <xsl:template match="title">
{panel}
      <xsl:value-of select="."/>
   </xsl:template match>
{panel}

and this as well:

{panel}
   <!-- DOES  WORK -->
   <h1>
      Titel: <xsl:value-of select="."/>
   </h1>
{panel}

Further Hints

Avoid xsl:attribute

You should not use the xsl:attribute element. It can be used, but if something does not work as expected in an area where you use xsl:attribute, try to avoid it.

Instead of

{panel}
  <img>
{panel}
	<xsl:attribute name="src"><xsl:value-of select="@url"/></xsl:attribute>-->
{panel}
  </img>
{panel}

write

{panel}
  <img src="{@url}"/>
{panel}

Avoid Namespaced function

Python, PHP, EXSLT (and certainly others) allow you to define your own functions. Avoid them at all cost in the XSLTs you send to BXE They're of no value in the first place, but more importantly, they make Mozilla throw errors on loading the XSLT and BXE won't work.

If you can't remove those functions from the XSLT, you can extend xsl/transformxsl.xsl with a template like this:

xsl:include

BXE 2.0 also supports the xsl:include statement.

The RelaxNG File

See RelaxNG and BXE 2.0 RelaxNGEnhancement for more info