1.
Presented by Michael Davis & Morgan Bibbs
XML & XSL
CASE STUDY: An XML based snippet for one-off manual profile pages.

2. Digital Design & Development!
Before you get started on your own project… Who ya gonna call??
Digital Design & Development!

3. DEFINING TERMS, PROVIDING CONTEXT
XML = eXtensible Markup Language XSL = eXtensible Stylesheet Language
Components of XSL:
XSLT = transforms XML
XPath = navigates XML
XQuery = queries XML
*W3School s

4. A note about extensible Markup Language
<sea>
<hole>
<log>Pine</log>
<bump></bump>
<amphibian></amphibian>
<tail></tail>
</hole>
<log>Oak</log>
<bump>Cause: lightning</bump>
<amphibian>Tree Frog</amphibian>
<tail>At first...</tail>
<log>Mangrove</log>
<bump>Cause: gator damage</bump>
<amphibian>Pig Frog</amphibian>
<tail>Not anymore!</tail>
</sea>
There is no defined syntax for XML
You can mix HTML syntax with your own markup
As long as the XSL declarations correspond with the XML syntax, you’re good to go

5. The stylesheet for the previous two documents.
OU Templates
Files required - file type, purpose, and language
File Type
Purpose
Language
Template Image
This is what users will see when they select a new page or section to create.
GIF
TCF
Defines new page/section setup form and 
what files to create in a new section.
XML
TMPL
Outlines the PCF page structure, page 
properties, and editable regions.*
XSL
The stylesheet for the previous two documents.
* The file extension PCF is meaningless. Only once the PCF is published does it matter. The file extension upon publish is defined in the stylesheet declaration on the second line of the TMPL document.

6. Why Snippets?
Creating a new template is a large-scale solution for a relatively small-scale problem.
XSL snippets allow for easy editing of complex layouts with minimal training required.
Our templates are based on XML/XSL for a reason. XML is reliable, tested, simple, and customizable.
We should be utilizing the XML/XSL framework of OmniUpdate, and outside of templates, snippets are the best way to do this.

7. OU snippets Files required - file type, purpose, and language
directory-profile-1.inc
Snippet source file.
XML
directory-profile-1.table-transform.xsl
Snippet Stylesheet
XSL
The snippet itself
Create a new snippet: name it, 
add to a category, link the .inc file, 
and save. –

8. DEMO - XSL functionality
In our demo, the components of XSL – XSLT, Xquery and Xpath – work together to accomplish the following specific functions and transformations:
Query xml elements, attributes, variables
Query specific xml paths and to create new variables
Dynamically apply classes and other attributes to content and show/hide content based on those xml queries
Generate unique IDs to link tabs to tab content

9. DEMO - XSL elements All XSL elements used:
<xsl:template></xsl:template>
<xsl:variable />
<xsl:value-of />
<xsl:attribute></xsl:attribute>
<xsl:apply-templates />
<xsl:if></xsl:if>
<xsl:choose>
<xsl:when></xsl:when>
<xsl:otherwise></xsl:otherwise>
</xsl:choose>
“When and “otherwise” must be nested in “choose” to complete the statement.

10. Top half of XSL stopping after tab list, before tab content
DEMO - xsl simplified and color coded
Top half of XSL stopping after tab list, before tab content
Bright blue = xsl
Light green = abbreviated xsl
Orange = html 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41
<xsl:template mode=“copy”>
<xsl:variable name=“tabs-filled” select=“xml string and conditional statements” />
<xsl:variable name=“total-tabs” select=“function of previous variable” />
<div class=“col-xs-12 col-sm-9”>
<div class=“entry-content”>
<h3><xsl:value-of select=“xml name string” /></h3>
<h4><xsl:value-of select=“xml title string” /></h4>
<p><xsl:value-of select=“xml bio info string” /></p>
<div id=“tabstrip”>
<ul id=“profileTab”>
<xsl:attribute name=“class”>
<xsl:choose>
<xsl:when test=“above variables and conditional statements”>nav nav-pills</xsl:when>
<xsl:otherwise>nav nav-tabs</xsl:otherwise>
</xsl:choose>
</xsl:attribute>
<xsl:for-each select=“xml string with conditional statements”>
<li>
<xsl:if test=“assign first item active class”>active</xsl:if>
<a href=“xsl-generated id”><xsl:value-of select=“xsl string”></a>
</li>
</xsl:for-each>
</ul>
Two additional variables for education-filled, website-filled

11. THANK YOU! Resources OFFICIAL XML SCHEMA
DEMO RESOURCES:
THANK YOU!