if-content
oder css:if-content
spezifiziert ein Element im content
if-not-content
oder css:if-not-content
kehrt die Bedingung für ein Element im content
um, z.B.:
<drop css:theme="#portlet-wrapper" css:if-not-content=".portlet"/>
if-not-path
spezifiziert einen URL-Pfad, der mit dem aktuellen Request nicht erfüllt sein darf damit die Regel angewendet wird, z.B.:
<drop css:theme="#news-box" if-not-path="/news"/>
if-path
oder css:if-path
spezifiziert einen Pfad in content
Soll der Pfad z.B. beginnen mit somewhere
, sieht die Regel folgendermaßen aus:
<copy
if-path="/somewhere"
css:theme="#content"
css:content="body > *"
/>
Angabe eines exakter Pfad mit:
if-path="/somewhere/"
Angabe des Pfadende mit:
if-path="somewhere/"
Angabe eines Pfadbestandteils mit:
if-path="somewhere"
if-not-path
oder css:if-not-path
kehrt die Bedingung für einen Pfad im content
um
if="$mode=''"
spezifiziert einen Knoten, der vorhanden sein muss, damit eine Regel oder ein Theme angewendet werden:
<drop css:theme=".warning" if="$mode = 'anon-personalbar'" />
if-not="$mode=''"
spezifiziert einen Knoten, der nicht vorhanden sein darf, damit eine Regel oder ein Theme ausgeführt werden
Gruppierung von Bedingungen:
<rules xmlns="http://namespaces.plone.org/diazo"
xmlns:css="http://namespaces.plone.org/diazo/css"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<rules css:if-content="#personal-bar">
<after css:theme-children="#header-box" css:content="#user-prefs"/>
<after css:theme-children="#header-box" css:content="#logout"/>
</rules>
…
</rules>
Verschachtelung von Bedingungen:
<rules if="condition1">
<rules if="condition2">
<copy if="condition3" css:theme="#a" css:content="#b"/>
</rules>
</rules>
entspricht:
<copy if="(condition1) and (condition2) and (condition3)" css:theme="#a" css:content="#b"/>
<theme href="theme.html"/>
<theme href="news.html" css:if-content="body.section-news"/>
<theme href="members.html" css:if-content="body.section-members"/>
Mit Inline-XSLT-Anweisungen lassen sich z.B. die Leerzeichen zwischen ELementen entfernen und automatische Einrückungen vornehmen:
<xsl:strip-space elements="*" />
<xsl:output indent="yes"/>
Inline XSLT-Anweisungen werden direkt innerhalb des <rules>
-Tag angegeben und ohne Bedingungen ausgeführt.
<after theme-children="/html/head">
<style type="text/css">
/* From the rules */
body > h1 { color: red; }
</style>
</after>
<replace css:theme="#details">
<dl id="details">
<xsl:for-each css:select="table#details > tr">
<dt><xsl:copy-of select="td[1]/text()"/></dt>
<dd><xsl:copy-of select="td[2]/node()"/></dd>
</xsl:for-each>
</dl>
</replace>
Mit <replace>
lässt sich auch der Inhalt modifizieren, so kann z.B. das input
-Element mit der Klasse searchButton
ersetzt werden durch ein button
-Element vom Typ submit
:
<replace css:content="div#portal-searchbox input.searchButton">
<button type="submit">
<img src="images/search.png" alt="Search" />
</button>
</replace>
Ein Absatz ohne Inhalte lässt sich z.B. so entfernen:
<drop content="p[not(*) and (not(normalize-space()) or text() = ' ')]"/>
Tags lassen sich z.B. am Beginn oder Ende eines Inhaltsbereichs einfügen:
<replace css:theme="#account a.dropdown-toggle"
css:content="#portal-personaltools li#anon-personalbar a" />
<before css:theme-children="#account a.dropdown-toggle"
method="raw">
<i class="icon-user"></i>
</before>
Etwas aufwändiger wird es, wenn Tags innerhalb von Inhaltselementen eingefügt werden sollen:
<replace css:content-children="#content" css:theme-children="#content"/>
<before css:theme-children="#content">
<div id="wrapper">
<xsl:apply-templates css:select="#title" mode="raw"/>
<xsl:apply-templates css:select="#description" mode="raw"/>
</div>
</before>
<drop css:content="#title"/>
<drop css:content="#description"/>
Auch die Attribute eines Tags lassen sich ändern. So kann z.B. eine css- Klasse hinzugefügt werden mit:
<xsl:template match="ul[@id='portal-globalnav']/li/@class[contains(., 'selected')]">
<xsl:attribute name="class"><xsl:value-of select="." /> current-menu-item</xsl:attribute>
</xsl:template>
Auch Bilder in content
lassen sich hiermit in einer bestimmten Größe anzeigen mit:
<replace css:theme="#content" css:content="#content" />
<xsl:template match="img/@src[not(contains(., '@@'))]">
<xsl:attribute name="src"><xsl:value-of select="." />/@@/images/image/thumb</xsl:attribute>
</xsl:template>
Dies ändert z.B.:
<img src="smiley.gif" class="myimage" />
in:
<img src="smiley.gif/@@/images/image/thumb" class="myimage" />
Mit xsl:copy
lassen sich Texte im Inhalt ergänzen, z.B.:
<replace css:theme="#content"
css:content="#content" />
<xsl:template match="h2/text()">
<xsl:copy /> – Extra text
</xsl:template>
rules
-Dateien¶Mit dem XInclude
-Protokoll lassen sich andere rules
-Dateien einschließen, z.B.:
<rules
…
xmlns:xi="http://www.w3.org/2001/XInclude">
<xi:include href="base.xml" />
</rules>
<replace css:theme-children="#navigation ul.dropdown-menu li a"
css:content-children=".navTreeLevel2 > li > div"
href="/sitemap" />
Um entfernte Inhalte einbinden zu können, muss Diazo folgendermaßen konfiguriert werden:
[filter:theme]
use = egg:collective.diazo.readheaders
#You can use any other Diazo middleware options here, too!
read_network = True
Da der von Diazo verwendete libxml2-HTMLParser Namespace-Präfixe herauskürzt, kann z.B. der FaceBook Like-Button <fb:like></fb:like>
nicht integriert werden mit //*[local-name()="like"]
. Stattdessen kann z.B. folgende XSL-Transformation verwendet werden:
<xsl:template match="activity|add-profile-tab|bookmark|comments|friendpile|like|like-box|live-stream|login-button|pronoun|recommendations|serverFbml|profile-pic|user-status">
<xsl:element name="fb:{local-name()}" xmlns:fb="http://www.facebook.com/2008/fbml">
<xsl:apply-templates select="@*|node()"/>
</xsl:element>
</xsl:template>
Üblicherweise gibt Diazo den HTML-Seiten den Doctype XHTML 1.0 Transitional
. Um Strict
anzugeben, sollte folgende XSLT angegeben werden:
<xsl:output
doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN"
doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"/>
Es ist nicht möglich, den HTML5-Doctype mit XSLT zu setzen. Stattdessen sollte dann <!DOCTYPE html>
gesetzt werden.
Siehe auch
Englische Diazo-Dokumentation
Die Tests von Diazo enthalten viele gebräuchliche Regeln
Snippets vor allem zur Nutzung von Bootstrap und Foundation