• HelpCenter
• Tips
• 2CelledNoteTable

2-Celled Note Table

This article outlines an implementation of a two celled Note-style table. The special requirement for this formatting is that the first cell of the table be fixed, while the second cell should be relative to allow the text in the second cell to resize in unison with any browser resize event.

This implementation will feature an XSL override using wwtransform:super mechanism. It will also feature a custom FTI setting for defining the image which should appear in the left cell. The exercise is comprised of the following stages:

• Create the project.
• Create the override.
• Verify the override.
• Code the override.

Create the Project

First things first. In ePublisher Pro, create a new project. In the exercise the project is named 2-Celled Note Table and it uses the Dynamic HTML format.

Create the Override

Next, create a Target override. To do this create the following hierarchy within your project folder:

Targets\<Target-Name>

The file that is to be overridden is content.xsl and it existing in the Transforms directory of the base format. Create an empty text file at the following location:

Targets\<Target-Name>\Transforms\content.xsl

Verify the Override

Put the following xsl code within the file:

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns="http://www.w3.org/1999/xhtml" 
                              xmlns:html="http://www.w3.org/1999/xhtml" 
                              xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
>
  <xsl:import href="wwtransform:super" />
</xsl:stylesheet>

and finally, generate output. If all goes well, the project should execute as normal. In it current state, the override only refers to the base content.xsl which is in the Formats area of the directory where ePublisher Pro was installed.

Code the Override

The content.xsl file is included by pages.xsl and wrappers.xsl for processing the XML representation of the source document. This XML file has a WIF extension and can be found in the Data directory after output is generated for a given ePublisher project. WIF (WebWorks Intermediate Format) is the intermediate XML format to which all types of ePublisher input are normalized. content.xsl includes XSL match templates which match the patterns of the WIF element names. This override needs to match WIF's Table element.

Replace the contents of the content.xsl file that was just created with the following::

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns="http://www.w3.org/1999/xhtml" 
                              xmlns:html="http://www.w3.org/1999/xhtml" 
                              xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                              xmlns:wwmode="urn:WebWorks-Engine-Mode"
                              xmlns:wwdoc="urn:WebWorks-Document-Schema"
                              exclude-result-prefixes="html xsl wwmode wwdoc"
>
  <xsl:import href="wwtransform:super" />
  
  <xsl:template match="wwdoc:Table[@stylename = 'Warning']" mode="wwmode:content">
    <xsl:param name="ParamTable" select="." />
    
    <html:table style="border: 0px;">
      <html:tr>
        <!-- First cell with fixed width -->
        <!--                             -->
        <html:td style="width: 40px;">
          <html:img src="note-1.gif" style="border: 0px; vertical-align: baseline;" />
        </html:td>
        
        <!-- Second cell with relative width -->
        <!--                                 -->
        <html:td style="width: auto;">
          <xsl:for-each select="$ParamTable/wwdoc:TableBody/wwdoc:TableRow/wwdoc:TableCell[2]/wwdoc:Paragraph">
            <html:p>
              <xsl:for-each select="descendant::wwdoc:Text">
                <xsl:value-of select="@value" />
              </xsl:for-each>
            </html:p>
          </xsl:for-each>
        </html:td>
      </html:tr>
    </html:table>
  </xsl:template>
</xsl:stylesheet>

This approach uses XSL's priority assignment to create a specific match for any Warning-style tables. All tables of other styles match the pattern in the base content.xsl. This means that these styles will continue to use the normal ePublisher processing flow for table styles.

Review

This example demonstrates how to manually write the HTML code for a given table style using the ePublisher Platform. It uses the wwtransform:super URI to refer to the base version of the file, and uses built-in XSL priorities to create a specific match for the table style which is to be overridden.

There are some loose ends which should be tied up, such as, how can we count on note-1.gif being right next to the output page? Attached to this page is a more fully-featured implementation which addresses this aspect as well as some others.

2-Celled Note Table.zip

CategoryHowto