Copied to clipboard

Flag this post as spam?

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


  • Chris Clarke 22 posts 43 karma points
    Dec 23, 2010 @ 22:04
    Chris Clarke
    0

    List images within media folders within top media folder

    My users have images of weeds grouped and stored in media sub-folders by type (aquatic, ground plant, climber, bush, etc).  Over these sub-folders there's a Weeds top level media folder.

    For the parent Weed folder I'd like to output on a web page;


    Weed Type:  FOLDER-NAME1

         image4     image1    image33

    Weed Type:  FOLDER-NAME2

         image23     image8    image7

    etc....


    How do I iterate through each sub-folder for the parent Weed folder ?
    (I've no problem outputing weed images for a specific weed type sub-folder.)

    Help much appreciated.

  • Lee Kelleher 4026 posts 15837 karma points MVP 13x admin c-trib
    Dec 23, 2010 @ 22:33
    Lee Kelleher
    2

    Hi Chris,

    Here is some example XSLT to get you started... I'm making an assumption that you are using Umbraco v4.5 with the new XML schema!

    <!-- get the media id from somewhere? -->
    <xsl:variable name="mediaId" select="1234" />
    
    <!-- call GetMedia with the id and set the 'deep' parameter to true (or 1) -->
    <xsl:variable name="rootFolder" select="umbraco.library:GetMedia($mediaId, 1)" />
    
    <!-- check if there are any folders -->
    <xsl:if test="$rootFolder/Folder">
    
        <!-- loop through each folder -->
        <xsl:for-each select="$rootFolder/Folder">
    
            <!-- output the folder's title -->
            <h1>
                Weed Type: <xsl:value-of select="@nodeName" />
            </h1>
    
            <!-- check if there are any images -->
            <xsl:if test="Image">
    
                <!-- loop through each image -->
                <xsl:for-each select="Image">
    
                    <!-- output the image tag HTML -->
                    <img src="{umbracoFile}" alt="{@nodeName}" height="{umbracoHeight}" width="{umbracoWidth}" />
    
                </xsl:for-each>
    
            </xsl:if>
    
        </xsl:for-each>
    
    </xsl:if>

    The idea here is that you call GetMedia with the mediaId and setting the 'deep' parameter to true - this should return all the child media nodes too.

    Then it's a case of looping through each of the folders/images.

    Let us know how you get on!

    Cheers, Lee.

  • Chriztian Steinmeier 2800 posts 8791 karma points MVP 8x admin c-trib
    Dec 23, 2010 @ 22:33
    Chriztian Steinmeier
    2

    Hi Chris,

    This should get you started - feel free to ask about the specifics, if you're curious:

    <?xml version="1.0" encoding="utf-8" ?>
    <xsl:stylesheet
        version="1.0"
        xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
        xmlns:umb="urn:umbraco.library"
        exclude-result-prefixes="umb"
    >
    
        <xsl:output method="xml" indent="yes" omit-xml-declaration="yes" />
    
        <xsl:param name="currentPage" />
    
        <!-- Root folder in Media that holds the folders to output -->
        <xsl:variable name="mediaRootFolderId" select="1200" />
    
        <xsl:template match="/">
            <!-- Pass in true() to get XML for all nodes below -->
            <xsl:variable name="mediaRootNode" select="umb:GetMedia($mediaRootFolderId, true())" />
    
            <!-- If we didn't get an error, output Folder elements that contain Image elements -->
            <xsl:apply-templates select="$mediaRootNode[not(error)]/Folder[Image]" />
    
        </xsl:template>
    
        <!-- Template for folders -->
        <xsl:template match="Folder">
            <div class="folder">
                <h2>Weed type: <xsl:value-of select="@nodeName" /></h2>
                <div class="images">
                    <!-- Output all images in here -->
                    <xsl:apply-templates select="Image" />
                </div>
            </div>
        </xsl:template>
    
        <!-- Template for images -->
        <xsl:template match="Image">
            <img src="{umbracoFile}" width="{umbracoWidth}" height="{umbracoHeight}" alt="{@nodeName}" />
        </xsl:template>
    
    </xsl:stylesheet>
    
    As you might see, you'll need to supply the correct ID for the containing Media folder, and maybe tweak the output templates for your specific needs.
    Merry X-Mas!
     

    /Chriztian

  • Lee Kelleher 4026 posts 15837 karma points MVP 13x admin c-trib
    Dec 23, 2010 @ 22:48
    Lee Kelleher
    0

    I like Chriztian's XSLT, it's much much better!

    I was going to use xsl:apply-templates, but didn't want to seem to over-complicate it! ;-) haha

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies