getmedia xslt on news list

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

eddy 43 posts 64 karma points

Oct 09, 2011 @ 22:14

I'm using 4.5.2 and the new Schema and want a list of news items with their images on the homepage. I've created the following xslt which displays the news title but I cannot get the associated media file to render. The Image is linked via the media picker and also cropped using the Image Cropper data type, therefore I need the image path followed by the suffix '_banner.jpg' which is the associated crop name.

I would appreciate any help.

Eddy

Xslt:

<ul id="newscarousel" >
<!-- This selects our data and spits it out in the following format once for each entry found  -->
  <xsl:for-each select="umbraco.library:GetXmlNodeById($source)/descendant::NewsItem [@isDoc and string(umbracoNaviHide) != '1']">
  <!-- This sorts the results by date decending -->
    <xsl:sort select="@createDate" order="descending" />    
    <!-- This limits the articles presented by the maxItem variable -->
    <xsl:if test="position() &lt;= $maxItems">
      <li>
      <!-- this prints all media nodes -->
        <img src="{umbraco.library:GetMedia(./bannerImage, false())/umbracoFile}" />
        <div id="carouseltitle">
          <h3><a href="{umbraco.library:NiceUrl(@id)}"><xsl:value-of select="@nodeName" /></a></h3>
        </div>
      </li>
    </xsl:if>
  </xsl:for-each>
</ul>

Here is the xml from one of the news items:

<Image id="1621" version="f098f151-e125-4b67-a507-8a2cc60ab8b4" parentID="1618" level="2" writerID="0" nodeType="1032" template="0" sortOrder="2" createDate="2011-10-06T09:48:24" updateDate="2011-10-06T09:48:25" nodeName="test2" urlName="test2" writerName="Administrator" nodeTypeAlias="Image" path="-1,1618,1621"><umbracoFile>/media/25270/penguins.jpg</umbracoFile><umbracoWidth>1024</umbracoWidth><umbracoHeight>768</umbracoHeight><umbracoBytes>777835</umbracoBytes><umbracoExtension>jpg</umbracoExtension><imagecropper><crops date="06/10/2011 09:48:37"><crop name="smallsquare" x="615" y="56" x2="805" y2="246" url="/media/25270/penguins_smallsquare.jpg" /><crop name="mediumsquare" x="128" y="59" x2="418" y2="334" url="/media/25270/penguins_mediumsquare.jpg" /><crop name="banner" x="199" y="50" x2="799" y2="300" url="/media/25270/penguins_banner.jpg" /></crops></imagecropper></Image>

Copy Link

eddy 43 posts 64 karma points

Oct 09, 2011 @ 23:01

I'm one step closer. Thanks to some tips from Sascha here.

<xsl:if test="current()/bannerImage != ''">
    <xsl:variable name="imageSource" select="umbraco.library:GetMedia(current()/bannerImage, '0')" />  
    <img src="{$imageSource/umbracoFile}" />
</xsl:if>

Now I just need to insert the crop name '_banner' into the file path.

Copy Link

Fuji Kusaka 2203 posts 4220 karma points

Oct 10, 2011 @ 04:52

Hi eddy,

You can try to concat your img tag

<xsl:variablename="imageSource"select="umbraco.library:GetMedia(current()/bannerImage, '0')"/>

<xsl:for-each select="$imageSource/Image">
   <img src="{concat(substring-before(umbracoFile,'.'),'_banner.jpg')}" />
</xsl:for-each>

Copy Link

eddy 43 posts 64 karma points

Oct 10, 2011 @ 15:39

Thanks Fuji. I couldn't get the Concat to work but the Umbraco TV episode on the image cropper data type helped me out in the end. Here's what worked:

<xsl:choose>
          <xsl:when test="current()/bannerImage">
            <img>
              <xsl:attribute name="src">
                <xsl:value-of select="umbraco.library:GetMedia(current()/bannerImage, '0')/imagecropper//crop [@name='banner']/@url" />
              </xsl:attribute>
            </img>
          </xsl:when>
          <xsl:otherwise>
            <img src="media/25270/penguins_banner.jpg"></img>
          </xsl:otherwise>
        </xsl:choose>

Eddy

Copy Link

Fuji Kusaka 2203 posts 4220 karma points

Oct 10, 2011 @ 21:28

0

Hey Eddy, at least you got it working.

Copy Link
is working on a reply...

Please Sign in or register to post replies