Copied to clipboard

Flag this post as spam?

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


  • John Halsey 59 posts 220 karma points
    Jun 11, 2013 @ 13:35
    John Halsey
    0

    Retrieving alt text from media images in XSLT

    Hello,

    I'm pretty new to Umbraco, but so far I am absolutely loving it.  I've managed to pick up XSLT pretty quickly and have some pretty cool stuff going on, but I'm stuck with one particular problem that I was after some help with.

    I'm developing an accessories website which allows content editors to add new products to our inventory whenever they need.

    I've got a doc type set up that allows them to select a main image from the media library, add a title, short and long descriptions as well as some other options in drop downs.  That's all working beautifully and I have a loop set up on a front "products" page which loops through all the products and displays a small version of the image, with title and short decription for all the products which I'm happy with.

    I'm getting stuck however with the alt text for the image.  All the images in the media library have a textString altText which are all populated.  I can't work out how to retrieve that data into my looping images.

    My XSLT currently looks like this...

    <xsl:for-each select="$currentPage/Product [@isDoc and string(umbracoNaviHide) != '1']">
    <div class="productListDiv">
    <li>
    <a href="{umbraco.library:NiceUrl(@id)}">
    <xsl:if test="mainImage &gt; 0">
    <img src="{umbraco.library:GetMedia(mainImage,true())/umbracoFile}" 
    width="100" class="productImage"/> </xsl:if>
    <h3><xsl:value-of select="brand"/>&nbsp;<xsl:value-of select="productTitle"/></h3>
    </a>
    <p><xsl:value-of select="shortDescription"/></p>
    </li>
    </div>
    </xsl:for-each>

     

    I've tried to find the altText by doing something like.. 

    <xsl:value-of select="umbraco.library:GetItem('Int32 nodeID', 'altText')"/>

    but I don't know how to find the ID of the node via XSLT. (I know what the node ID is for any given image, but i need it to be dynamic).

    is anyone able to help at all?

    Thanks in advance.

  • Chriztian Steinmeier 2798 posts 8788 karma points MVP 7x admin c-trib
    Jun 15, 2013 @ 22:44
    Chriztian Steinmeier
    101

    Hi John,

    You actually already have the image so you can just grab the altText property like you grab the umbracoFile property - something like this:

    <xsl:for-each select="$currentPage/Product[@isDoc][not(umbracoNaviHide = 1)]">
        <div class="productListDiv">
            <li>
                <a href="{umbraco.library:NiceUrl(@id)}">
                    <!-- Make sure that an image is selected... -->
                    <xsl:if test="normalize-space(mainImage)">
                        <!-- Grab the media node -->
                        <xsl:variable name="mediaNode" select="umbraco.library:GetMedia(mainImage, false())" />
                        <img src="{$mediaNode/umbracoFile}" width="100" class="productImage" alt="{$mediaNode/altText}" />
                    </xsl:if>
                    <h3>
                        <xsl:value-of select="brand" />
                        <xsl:value-of select="productTitle" />
                    </h3>
                </a>
                <p>
                    <xsl:value-of select="shortDescription"/>
                </p>
            </li>
        </div>
    </xsl:for-each>

    /Chriztian

  • John Halsey 59 posts 220 karma points
    Jun 17, 2013 @ 10:50
    John Halsey
    0

    Hi Chriztian,

    Yes it worked perfectly.  So simple!

    Thanks for your help.

Please Sign in or register to post replies

Write your reply to:

Draft