Copied to clipboard

Flag this post as spam?

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


  • Shaun Smith 35 posts 61 karma points
    Jan 15, 2011 @ 03:37
    Shaun Smith
    0

    Macro to get Image property of child documents

    Hi,

    I'm not too sure what I'm meant to be looking for; so I wondered if I might find some help here.

    My Website is structured like so:

     

    So "Flank A Tank", "My Web...", "..." are document types that have a upload property aliased 'image':

    On the "Portfolio" page I have a macro that prints a list of links to the individual project pages (which works fine). I'm also trying to draw the image from the project page so that I may display it under the list, but I don't seem to be getting anywhere. Here is the XSLT:

     

      <!-- Input the documenttype you want here -->
      <xsl:variable name="level" select="2"/>
      <xsl:template match="/">
    
        <!-- The fun starts here -->
        <ul>
          <xsl:for-each select="$currentPage/ancestor-or-self::* [@level=$level]/* [@isDoc and string(umbracoNaviHide) != '1']">
            <xsl:if test="position() &lt; 4">
              <li>
                <a href="{umbraco.library:NiceUrl(@id)}">
                  <xsl:value-of select="@nodeName"/>
                </a>
    
              </li>
            </xsl:if>
          </xsl:for-each>
        </ul>
    
        <xsl:for-each select="$currentPage/child::* [@level=$level]/* [@isDoc and string(umbracoNaviHide) != '1']">
          <xsl:if test="position() &lt; 4">
          <xsl:if test="$currentPage/child/image != ''">
            <xsl:variable name="img" select="umbraco.library:GetMedia($currentPage/child/img, 0)"/>
            <div class="movImg">
              <img src="{$img/umbracoFile}" alt="{$img/@nodeName}" />
            </div>
          </xsl:if>
          </xsl:if>
        </xsl:for-each>

     

    What am I getting wrong Xpath? the XSLT itself? the GetMedia call? or a bit of everything?

    I'm running 4.5.2 too.

    thanks,

    Shaun.

  • Daniel Bardi 927 posts 2562 karma points
    Jan 15, 2011 @ 09:58
    Daniel Bardi
    0

    The upload field only contains the path to the uploaded file.  Even though the file is saved in the media folder it is not a media item, therefore it can not be accessed with GetMedia.

    Simply reference the field as a standard text value.

    <img><xsl:attribute name="src"><xsl:value-of select="$currentPage/image"/></xsl:attribute></img>

    or

    <img src='{$currentPage/image}'/>

     

  • Kim Andersen 1447 posts 2196 karma points MVP
    Jan 15, 2011 @ 11:04
    Kim Andersen
    0

    Hi Shaun.

    If you want to print out a list of images from the children of the current page you need to change the code to this:

    <xsl:for-each select="$currentPage/* [@isDoc and string(umbracoNaviHide) != '1']">
       
    <xsl:if test="position() &lt; 4">
         
    <xsl:if test="image != ''">
           
    <div class="movImg">
             
    <img src="{image}" alt="{@nodeName}" />
           
    </div>
         
    </xsl:if>
       
    </xsl:if>
    </xsl:for-each>

    The above code, will render the images from the nodes under the current page. The alt-attribute on the image will be output as the nodename from the page that's currently being processed.

    /Kim A

  • Shaun Smith 35 posts 61 karma points
    Jan 15, 2011 @ 13:21
    Shaun Smith
    0

     

     

  • Kim Andersen 1447 posts 2196 karma points MVP
    Jan 15, 2011 @ 14:02
    Kim Andersen
    0

    Hi again Shaun.

    I think your last post missed something :)

    Could you post it again?

    /Kim A

  • Shaun Smith 35 posts 61 karma points
    Jan 15, 2011 @ 14:16
    Shaun Smith
    0

    aw crap, That's so annoying.... I had it in my clipboard for ages too :(

    Thanks Dan, your solution didn't actually work for me: but I've never seen how to inject attributes into elements using XSLT (and I've already bumped into that problem too) so thanks for the tip. *High five*

    Cheers Kim, (I'm trying so hard not to whip out any Matrix puns...).

    Your code does exactly what I want it to do thanks a lot, I'm gonna whack on some javascript and make me a little carousal.

    I do have a query though,
    If my Porfolio page contained a property with the alias of 'image' would it also be returned by the results (i don't want it to)?
    If I wanted to get the bodyText from my project item?
    Where are all the @varNames coming from?

    I'm not too sure what I need to learn more of right now; so I guess I'm sorta fishing for keywords, tutorials, videos, samples.

    Thanks again +1 to you both.

  • Kim Andersen 1447 posts 2196 karma points MVP
    Jan 15, 2011 @ 14:28
    Kim Andersen
    0

    No, the image of the portfolio page will not be shown as it's only the the childnodes that we're running through, so no problem there :)

    If you want to render the bodyText from the nodes as well, you could add this:

    <xsl:value-of select="bodyText" disable-output-escaping="yes" />

    inside the for-each loop.

    The @varNames are the attributes that can be found on all of the nodes in Umbraco. You can try printing out the $currentPage to see the XML of the current page, and in here you'll find a set of attributes. Try this:

    <textarea>
    <xsl:copy-of select="$currentPage" />
    </textarea>

    You can then copy the returned XML into some sort of editor (Visual Studio, Notepad++, TextMate etc.) to see it a bit more structured :)

    /Kim A

  • Shaun Smith 35 posts 61 karma points
    Jan 15, 2011 @ 14:57
    Shaun Smith
    0

    Cheers Kim, that's fantastic!

    Haha! wow, that's really going to help me immensely, actually seeing the XML makes it so much easier!

    1 last thing if that's OK: What is the common technique for performing some sort of manipulation to the returned value?

    eg. I have some massive bodyText for one of my projects, but on the main portfolio page I just want say the first 100 chars as an intro?

    This is the best way I know how to describe what I mean:

        public string ToIntroString(string bodyText)
        {
            string t = bodyText;
            if (bodyText.Length > 100)
            {
                t = bodyText.Substring(0, 97);
                t = t + "...";
            }
    
            return t;
        }

    know what I mean?

  • Kim Andersen 1447 posts 2196 karma points MVP
    Jan 15, 2011 @ 16:28
    Kim Andersen
    0

    Hi again Shaun.

    I'm glad that you're learning new stuff today :)

    If you just want the first 100 characters you can do like this in your XSLT:

    umbraco.library:TruncateString(umbraco.library:StripHtml(description),160,'...')

    <xsl:value-of select="umbraco.library:TruncateString(umbraco.library:StripHtml(bodyText),100,'...')" disable-output-escaping="yes" />

    As you can see I'm using two extensions in the above code. The one that actually cuts the string after 100 chars, is the TruncateString. In the above code I told it to only take the first 100 chars from the bodyText, and after the 100 chars insert three dots (...). The other extension that I'm using is the StripHtml. This is used because where taking content from a richtext editor which returns HTML. If you are using the TruncateString on content from a RTE you better strip the HTML, otherwise you sometimes end up, cutting the content in the middle of some HTML code, and this is not a pretty sight ;)

    /Kim A

  • Shaun Smith 35 posts 61 karma points
    Jan 16, 2011 @ 01:56
    Shaun Smith
    0

    Thanks Kim, another greatly valued lesson. Top marks on the pre-emptive html stripping too :)

    I am left pondering again (theres always some questions with a good answer),

    Am I able to add to the extensions?
    And what are they written in?

    Thanks again, I have learned alot today, I've been brushing up on some XSLT (I normally use SQL storage).

    Edit: took out a lazy question, I'm able to find a list of extensions here:

    http://our.umbraco.org/wiki/reference/umbracolibrary

  • Kim Andersen 1447 posts 2196 karma points MVP
    Jan 16, 2011 @ 12:18
    Kim Andersen
    0

    Hi Shaun

    Yeah you can find a list of the extensions in the Wiki, like you mentioned in your update. Not all of them has a good description, but some of them does. Otherwise you can find then inside Umbraco. If you're going to an XSLT file, and click the "Insert xslt:value-of"-button at the top. Here you'll click the "Get extensions"-button and finds the umbraco.library in the drop down list. Now all of the available umbraco.library extensions will be showed to you in the drop down on the right.

    I'm not quite sure I understand this question: "Am I able to add to the extensions?". Could you maybe give some details of what you want to know?

    /Kim A

  • Shaun Smith 35 posts 61 karma points
    Jan 16, 2011 @ 16:20
    Shaun Smith
    0

    Thanks again, Kim, You deserve at least 3 answer tickys in this thread.

    So my guess is 'umbraco.library' is some sort of functional code library, somewhere.

    What is the likelihood that this library will contain all the functions I will ever need?
    What happens when it doesn't contain the right one? do I mix and match, similar to how you have done above (strip html, then truncate) or can I create my own?

    eg.

    <xsl:value-of select="umbraco.library:TruncateString(umbraco.library:StripHtml(bodyText),100,'...')" disable-output-escaping="yes" />

    would become:

    <xsl:value-of select="umbraco.library:StripAndTrun(bodyText,100)" disable-output-escaping="yes" />

    would this be better suited to a .net control? can I add my own library of extensions?

  • Jan Skovgaard 11280 posts 23678 karma points MVP 10x admin c-trib
    Jan 16, 2011 @ 16:28
    Jan Skovgaard
    0

    Hi Shaun

    If you have some C# skills it's should be fairly easy for you to write your own xslt extensions for Umbraco. This video on umbraco.tv is a good starting point: http://umbraco.org/help-and-support/video-tutorials/developing-with-umbraco/xslt-extensions/introduction-to-xslt-extensions - if you have not subscribed I will recommend you to do so 19€ for all the good stuff in there is worth the money.

    I think what you're trying to do is better suited to handle in XSLT and using your own extension to provide yourself with more options. In this case I think that using a user control would seem like overkill from my point of view.

    Hope this helps.

    /Jan

  • Kim Andersen 1447 posts 2196 karma points MVP
    Jan 16, 2011 @ 16:35
    Kim Andersen
    0

    Yeah Shaun. You can for sure create your own XSLT extensions. If you do know how to work with C#, you can create all the extensions that you want to.

    I don't know if you have bought a umbraco.tv subcription (It's worth the money ;) ), but if you have there are two full videos on how to create your own XSLT extensions here. You can actually see three minutes for free, which gives you a good idea on how XSLT extensions work :)

    /Kim A

  • Kim Andersen 1447 posts 2196 karma points MVP
    Jan 16, 2011 @ 16:37
    Kim Andersen
    0

    Okay, Jan pretty much beat me there. But the answer look the same, so just go for it Shaun :)

    /Kim A

  • Shaun Smith 35 posts 61 karma points
    Jan 16, 2011 @ 17:34
    Shaun Smith
    0

    Thanks Jan, I assumed a .net control would be a bit overkill just to format some data - hence the digging for more info on the extensions.

    I watched some of the 'three minutes for free' videos, they are like when your favourite TV show ends on a cliffhanger!
    now, after this advice, I'll be signing up as soon as I can.

    Yet again, thank you Kim. I'm going to start my next long winded thread now about implementing commenting into an umbraco site, if your interested! haha!

    Thanks again,

    Shaun.

    p.s. Have you guys got into a "Type --> Copy --> Refresh Page --> Paste --> Post" routine, or could this be a session problem I'm having with Chrome on the Umbraco forums? My posts don't get updated to the thread sometimes... weird...

  • Kim Andersen 1447 posts 2196 karma points MVP
    Jan 16, 2011 @ 17:47
    Kim Andersen
    0

    About the "Type-->Copy....". What I usually do is to type my answer in the textbox at the bottom, and when I'm done, I copy the entire text. Then I click the Submit-button, and usually the answer is posted afterwards. But sometimes the answer isn't posted, and then I'm just pasting in the text and click the Submit-button again. NB. Sometimes the answer is registered, but the page just doesn't reload, so I always open the frontpage of our.umbraco.org in a new tab to check if my answer is in the "Forum talk"-list on the left :)

    /Kim A

  • Shaun Smith 35 posts 61 karma points
    Jan 16, 2011 @ 18:07
    Shaun Smith
    0

    Yeah, I keep forgetting to copy my text - really annoying after a long post :( 

Please Sign in or register to post replies

Write your reply to:

Draft