Umbraco: Display an Image, if one has been selected, using the Media Picker in an XSLT Macro
Umbraco: Display an Image, if one has been selected, using the Media Picker in an XSLT Macro
The follwoing XSLT file shows how to display an image from the Media Picker in Umbraco.
The important bit is highlighted.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp " "> ]>
<xsl:stylesheet
version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msxml="urn:schemas-microsoft-com:xslt"
xmlns:umbraco.library="urn:umbraco.library" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets"
exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets ">
<xsl:output method="xml" omit-xml-declaration="yes"/>
<xsl:param name="currentPage"/>
<xsl:template match="/">
<xsl:variable name="getimg" select="$currentPage/rightColumnImage"/> <!-- 1. Get the Image --> <xsl:if test="string($getimg)!=''"> <!--2. If an Image has been chossen, then do the following --> <div id="myimage"> <!-- 3. Just a CSS div to hold the image--> <xsl:variable name="media" select="umbraco.library:GetMedia($currentPage/rightColumnImage, 0)" /> <!-- 4 assign the image to a variable 'media' --> <img src="{$media/umbracoFile}" alt="{$media/altText}" /> <!--5. Write out the Image -->
<!--<xsl:value-of select="$getimg" disable-output-escaping="yes"/>-->
</div>
</xsl:if>
<xsl:variable name="getcaption" select="$currentPage/rightColumnImageText"/>
<xsl:if test="$getcaption != ''">
<div id="mycaption">
<xsl:value-of select="$getcaption" disable-output-escaping="yes"/>
</div>
</xsl:if>
</xsl:template>
</xsl:stylesheet>
The follwoing XSLT file shows how to display an image from the Media Picker in Umbraco.
The important bit is highlighted.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp " "> ]>
<xsl:stylesheet
version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msxml="urn:schemas-microsoft-com:xslt"
xmlns:umbraco.library="urn:umbraco.library" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets"
exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets ">
<xsl:output method="xml" omit-xml-declaration="yes"/>
<xsl:param name="currentPage"/>
<xsl:template match="/">
<xsl:variable name="getimg" select="$currentPage/rightColumnImage"/> <!-- 1. Get the Image --> <xsl:if test="string($getimg)!=''"> <!--2. If an Image has been chossen, then do the following --> <div id="myimage"> <!-- 3. Just a CSS div to hold the image--> <xsl:variable name="media" select="umbraco.library:GetMedia($currentPage/rightColumnImage, 0)" /> <!-- 4 assign the image to a variable 'media' --> <img src="{$media/umbracoFile}" alt="{$media/altText}" /> <!--5. Write out the Image -->
<!--<xsl:value-of select="$getimg" disable-output-escaping="yes"/>-->
</div>
</xsl:if>
<xsl:variable name="getcaption" select="$currentPage/rightColumnImageText"/>
<xsl:if test="$getcaption != ''">
<div id="mycaption">
<xsl:value-of select="$getcaption" disable-output-escaping="yes"/>
</div>
</xsl:if>
</xsl:template>
</xsl:stylesheet>
Comments
Post a Comment