Hi Magnus,

the MediaPicker datatype just saves the ID of the media file, you will need to get the media item in order to get the url for the item:

<img alt="image description">
  <xsl:attribute name="src">
    <xsl:variable name="mediaItem" select="umbraco.library:GetMedia($currentPage/myMediaItem, 'false')/umbracoFile" />
  </xsl:attribute>
</img>

or by using the curly bracked notation:

<img alt="image description" src="{umbraco.library:GetMedia($currentPage/myMediaItem, 'false')/umbracoFile}" />

Check out some of the Xslt videos in umbraco.tv for more info!

Sascha

Just a small correction:

If you are using Sascha's first solution you need to use a <xsl:value-of> instead of a <xsl:variable> like this:

<img alt="image description">
  <xsl:attribute name="src">
    <xsl:value-of select="umbraco.library:GetMedia($currentPage/myMediaItem, 'false')/umbracoFile" />
  </xsl:attribute>
</img>

Or at least write out the declared variable inside the <xsl:attribute name="src">.

But the second solution should work just perfect, and is also less writing :)

/Kim A

Thanks for the replies!

I tried both of them but I'm getting errors on both (System.Overflow...The value is too big or too low etc) when saving the XSLT.

So, with this example:

<img alt="image description" src="{umbraco.library:GetMedia($currentPage/myMediaItem, 'false')/umbracoFile}" />

I guess that I'll have to change some parameters so that it fits my setup. But, I can't seem to figure out what. On my Document Type the Media Picker property has the name/alias: "portraitImage". Is this the value I need to use in the codeline above? Is it myMediaItem that should be replaced? Or should I look for another parameter?

/Magnus

Yeah you shall use the name of your field instead of the myMediaItem so your code will look like this:

<img alt="image description" src="{umbraco.library:GetMedia($currentPage/portraitImage, 'false')/umbracoFile}" />

The error when saving might come because it's possible that the portraitImage doesn't contain a value, and this will cause the extension to fail. To get arround this you can wrap the image-tag inside of an if-statement, to make sure that the portraitImage contains a value:

<xsl-if test="$currentPage/portraitImage != ''">
     <img alt="image description" src="{umbraco.library:GetMedia($currentPage/portraitImage, 'false')/umbracoFile}" />
</xsl:if>

Does that make a change?

/Kim A

My suggestion would be to create one XSLT macro for the site that will display an image and then call this XSLT template in your other macros, so you only have to write out the image tag once.

So create a XSLT file containing:

<xsl:template name="imageFromId">
  <xsl:param name="imageid"/>
 
  <xsl:if test="$imageid!=''">
        <xsl:variable name="image" select="umbraco.library:GetMedia($imageid, 'false')"/>
       
      <img src="{$image/data[@alias = 'umbracoFile']}" width="{$image/data[@alias = 'umbracoWidth']}" height="{$image/data[@alias = 'umbracoHeight']}" alt="{$image/@nodeName}"/>
 </xsl:if>
</xsl:template>

And then on your other macro have the following at the start of the XSLT

<xsl:include href="ImageTag.xslt"/>

and then call it with, insert into the select part the property that contains the media ID:

<xsl:call-template name="imageFromId">
         <xsl:with-param name="imageid" select="data[@alias='listImage']"/>
  </xsl:call-template>

Thanks again for all the support!

I've tried all suggestions but I'm still getting the error.

I'll try to explain what I'm trying to accomplish. Basically, I'm using the example shown in this video: http://umbraco.tv/documentation/videos/for-site-builders/xslt-primer/creating-a-news-list to build a page which uses a XSLT macro to list info from nodes below it. The video builds a newslist that lists newsitems below it. I'm building a peoplelist that should list peopleitems below it. What I've done is that I've created a Document Type for the "peopleitem". On this Documenttype I've placed a generic property of the Media Picker type that an editor could use to select a portrait image of the person described by on the node (peopleitem) he/she creates.

The contenttree looks like this:

The node "Anna Bok" above is of the PeopleItem Document Type and the Personlist is of the Peoplelist Document Type.

I've also created the XSLT macro (mentioned earlier ;) ). This macro is based on the "List Sub pages from Current page" template (also used in the video). By using this macro on the PeopleList Template (Personlist node in the screenshot above) I was hoping to list all people with a nice image next to everyone :). I have no problem with the name, email and phone properties but the image is giving me a hard time, as you all know by now.

<ul>
<xsl:for-each select="$currentPage/* [@isDoc and string(umbracoNaviHide) != '1']">

  <p>
  <h3>
  <a href="{umbraco.library:NiceUrl(@id)}">
      <xsl:value-of select="@nodeName"/>
    </a>
  </h3>
  
  <xsl:value-of select="roll"/>
  <br />
  <xsl:value-of select="epost"/>
  </p>
</xsl:for-each>
</ul>

Thanks for any help!

/Magnus

Hi Magnus,

sorry you got so much trouble with this. Let's see if this will fix it:

<ul>
<xsl:for-each select="$currentPage/* [@isDoc and string(umbracoNaviHide) != '1'">
  <xsl:if test="current()/bild != ''">
    <xsl:variable name="bild" select="umbraco.library:GetMedia(current()/bild, 'false')" />
    <img src="$bild/umbracoFile" />
  </xsl:if>

  <p>...</p>
</xsl:for-each>

This Xslt script is then running on the template for 'Personlist', right?

Sascha

Thanks Sascha, this feels like a step forward. No errors when saving the XSLT now but, the page renders this:

<img src="$bild/umbracoFile" />

when looking at the page renderd code.

//Magnus

No problem! The curly brackets did the trick! Thanks to all for taking the time!!!

:)

Magnus

Glad it works now! :)

is working on a reply...