Copied to clipboard

Flag this post as spam?

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


  • Anthony Candaele 1197 posts 2049 karma points
    Dec 27, 2010 @ 12:37
    Anthony Candaele
    0

    problems with implementing image in xslt

    Hi,

    I have created a macro container

    The macro container implements a macro 'insertwidget'

    the macro parameters are:

    Title (alias title type: text)
    Image (alias image, type: mediaCurrent)
    Intro (alias: intro, type: TextMultiLine)
    Link (alias: link, type: text)

    The insertwidget xslt file looks like this:

    <xsl:param name="currentPage"/>
        <xsl:variable name="title" select="/macro/title"/>
        <xsl:variable name="imageid" select="/macro/macroParam/Image/@id"/>
        <xsl:variable name="intro" select="/macro/intro"/>
        <xsl:variable name="link" select="/macro/link"/>
    <xsl:template match="/">

    <xsl:if test="$title and $intro">
      <div class="hotspot">
        <h4><xsl:value-of select="$title"/></h4>
        <xsl:if test="$imageid">
          <xsl:value-of name="image" select="umbraco.library:getMedia($imageid, 0)"/>
          <img src="{$image/umbracoFile}" width="52" height="52" />
        </xsl:if>
        <p><xsl:value-of select="$intro"/></p>
        <xsl:if test="$link">
        <a href="{umbraco.library:NiceUrl($link)}">link</a>
        </xsl:if>
      </div>  
    </xsl:if>

    But if I try to save my xslt file I get an error stating that there is an error in the line

    <xsl:value-of name="image" select="umbraco.library:getMedia($imageid, 0)"/>


    All I'm trying to do is to access the image that the user has chosen through the macro container

    Is this the right way to do it, or is there a better way?

    Thanks for your assistance,

    Anthony Candaele
    www.webmove.be
    Belgium

  • Kim Andersen 1447 posts 2196 karma points MVP
    Dec 27, 2010 @ 13:41
    Kim Andersen
    0

    I can't remembet what the mediaCurrent type returns, but let's say that your $imageid contains the id of a media item. Then you should probablt change this:

    <xsl:value-of name="image" select="umbraco.library:getMedia($imageid, 0)"/>

    to a variable like this:

    <xsl:variable name="image" select="umbraco.library:getMedia($imageid, 0)"/>

    I hope that works for you.

    /Kim A

  • Kim Andersen 1447 posts 2196 karma points MVP
    Dec 27, 2010 @ 13:47
    Kim Andersen
    0

    Oops, and you need to call the extension with a capital G like this: GetMedia().

    /Kim A

  • Anthony Candaele 1197 posts 2049 karma points
    Dec 27, 2010 @ 14:46
    Anthony Candaele
    0

    Hi Kim,

    Thanks for your suggestion, I adjusted the line

    and now I can save my xslt file, but at run time I still get an xslt parser error:

    If I test the value for

    <xsl:variable name="image" select="umbraco.library:GetMedia($imageid, 0)"/>

    Then I get the error:

    "The variable or parameter 'imageid' is either not defined or it is out of scope"

    I think the problems lies in the line where I try to get the value of the image id:

    <xsl:variable name="imageid" select="/macro/macroParam/Image/@id"/>

    I read on the forum ( http://our.umbraco.org/forum/core/41-feedback/10539-mediaCurrent-and-Macro-container )

    that if one tries to access a media id that was entered through the mediaCurrent datatype one should access this value like this

    <xsl:value-of select="/macro/macroParam/Image/@id" />

    But somehow this doesn't work.

    All in all I think I just don't grasp how one can access a media id that was entered through a mediaCurrent datatype. Alas the media current datatype seems like the only way to enter an image in a macro container.


    Thanks for your help,

    Anthony Candaele
    www.webmove.be
    Belgium

  • Kim Andersen 1447 posts 2196 karma points MVP
    Dec 27, 2010 @ 15:07
    Kim Andersen
    1

    In the top where you create the $imageid you should change the macroParam to image like this:

    <xsl:variable name="imageid" select="/macro/image/Image/@id"/>

    You must use 'image' as this is the alias of your macro parameter.

    When this is changed, could you try printing out the $imageid like this:

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

    Just to make sure that the variable does actually contain an id of a media item.

    If this is empty, then try printing out this:

    <textarea>
    <xsl:copy-of select="/macro/image" />
    </textarea>

    this should give us the content of the 'image'-parameter.

    /Kim A

  • Anthony Candaele 1197 posts 2049 karma points
    Dec 27, 2010 @ 17:08
    Anthony Candaele
    0

    Hi Kim,

    I adjusted my xslt-code, it now looks like this:

    <xsl:param name="currentPage"/>
        <xsl:variable name="title" select="/macro/title"/>
        <xsl:variable name="imageid" select="/macro/image/Image/@id"/>
        <xsl:variable name="intro" select="/macro/intro"/>
        <xsl:variable name="link" select="/macro/link"/>
    <xsl:template match="/">

    <xsl:if test="$title and $intro">
      <div class="hotspot">
        <h4><xsl:value-of select="$title"/></h4>
        <textarea>
          <xsl:copy-of select="$imageid"/>
        </textarea>
        <p><xsl:value-of select="$intro"/></p>
        <xsl:if test="$link">
        <a href="{umbraco.library:NiceUrl($link)}">link</a>
        </xsl:if>
      </div>  
    </xsl:if>

    But I still get the error:

    The variable or parameter 'imageid' is either not defined or it is out of scope

    If I change <xsl:copy-of select"$imageid"/> to

    <xsl:copy-of select="/macro/image"/>

    then the xslt visualizer tells me that "the XSLT didn't generate any output"

    For testing purposes I left out the image id variable completely, and then the xslt visualizer tells me :

    "The variable or parameter 'imageid' is either not defined or it is out of scope"

    So it seems like I cannot acces any macro parameter in my xslt-file.

    I wonder if this can have anything the do with my version of Umbraco (Umbraco Juno Beta)

    Thanks for your help,

    Anthony

  • Kim Andersen 1447 posts 2196 karma points MVP
    Dec 27, 2010 @ 17:40
    Kim Andersen
    0

    Hmm... It sounds like we're missing something obvious here. Could you try using a new xslt-file, and just write out the:

    <textarea>
     
    <xsl:copy-of select="/macro/image" />
    </textarea>

    If this new clean XSLT-file still doesn't render anything, then try to just output some plain text from the XSLT. Just write HELLO WORLD or something like that :)

    There should be no problems grabbing a parameter-value from an inserted macro.

    The macro connected to this XSLT-file, how do you insert this? Do you insert the macro in your Richtext Editor, in a template or how?

    /Kim A

  • Anthony Candaele 1197 posts 2049 karma points
    Dec 27, 2010 @ 18:15
    Anthony Candaele
    0

    Hi,

    I did the test with a clean xslt file with just the code

    <p>hello world</p>

    This was rendered fine.

    Some funny results if I add a clean xslt file with the code:

    <textarea><xsl:copy-of select="/macro/image"/>

    If I put the macro (Test) in my textpage template like this:

    <div id="sidebar">
              <umbraco:macro alias="umb2ndLevelNavigation" runat="server"></umbraco:macro>
              <umbraco:Macro image="" Alias="Test" runat="server"></umbraco:Macro>
          </div>

    Then in my rendered page, under the second level navigation, I get a iframe (or something looking like an iframe) with the code from my textpage template.

    To answer your last question, I inserted my widget macro in the Business Homepage template like this:

    <asp:Content ContentPlaceHolderId="cp_sidebar" runat="server">
      <umbraco:Item field="widgets" runat="server"></umbraco:Item>
    </asp:Content>

    Hopefully by this the mystery gets somewhat clearer :)

  • Anthony Candaele 1197 posts 2049 karma points
    Dec 27, 2010 @ 18:19
    Anthony Candaele
    0

    Hi,

    I did the test with a clean xslt file with just the code

    <p>hello world</p>

    This was rendered fine.

    Some funny results if I add a clean xslt file with the code:

    <textarea><xsl:copy-of select="/macro/image"/></textarea>

    If I put the macro (Test) in my textpage template like this:

    <div id="sidebar">
              <umbraco:macro alias="umb2ndLevelNavigation" runat="server"></umbraco:macro>
              <umbraco:Macro image="" Alias="Test" runat="server"></umbraco:Macro>
          </div>

    Then in my rendered page, under the second level navigation, I get a iframe (or something looking like an iframe) with the code from my textpage template.

    To answer your last question, I inserted my widget field in the Business Homepage template like this:

    <asp:Content ContentPlaceHolderId="cp_sidebar" runat="server">
      <umbraco:Item field="widgets" runat="server"></umbraco:Item>
    </asp:Content>

    The widget page field is a media container that has a macro 'insertwidgets'

    Hopefully by this the mystery gets somewhat clearer :)

  • Kim Andersen 1447 posts 2196 karma points MVP
    Dec 27, 2010 @ 19:15
    Kim Andersen
    0

    The reason why you get the code of the textpage in your textarea, is because that the value of the /macro/image is empty, and then the textarea will collapse and include the html. But the parameter will always be empty in that example that you showed above, because the parameter is empty I can see. You should probably insert a value in the image-parameter, where you inserted the macro, before this small test will have any effect.

    In the meantime I'll set up a new Umbraco 4.6 install and then try to recreate this issue on my local machine.

    /Kim A 

  • Kim Andersen 1447 posts 2196 karma points MVP
    Dec 27, 2010 @ 19:51
    Kim Andersen
    0

    Okay now, Anthony. I have set up a new install of Umbraco 4.6 Juno BETA at my local machine, and created a macro with the same parameters as you have, the same alias'es etc. And I got it working now.

    Try this piece of XSLT instead of yours.


    <xsl:param name="currentPage"/>
    <xsl:variable name="title" select="/macro/title"/>
    <xsl:variable name="imageid" select="/macro/image/Image"/>
    <xsl:variable name="intro" select="/macro/intro"/>
    <xsl:variable name="link" select="/macro/link"/>
        
    <xsl:template match="/">
      
      <xsl:if test="$title and $intro">
        <div class="hotspot">
          <h4><xsl:value-of select="$title"/></h4>
          <xsl:if test="$imageid">
            <img src="{$imageid/umbracoFile}" width="52" height="52" />
          </xsl:if>
          <p><xsl:value-of select="$intro"/></p>
          <xsl:if test="$link">
            <a href="{$link}">link</a>
          </xsl:if>
        </div>  
      </xsl:if>

    </xsl:template>

    This works for me.

    The mediaCurrent returns the media item, so we don't have to use the GetMedia extension at all, we already have the XML that we need. Therefore I've changed the imageid-variable a bit (excluded the last part /@id) and then I've changed the href attibute of the link a bit.

    As you have created the link parameter as a textstring, I'm guessing that the users will have to insert a total link, and not an id of a node in the tree. This means that I have removed the umbraco.library:NiceUrl() part, and just inserted the value of the textstring.

    I hope this code works for you, and I'm looking forward to hearing from you again :)

    /Kim A

  • Anthony Candaele 1197 posts 2049 karma points
    Dec 27, 2010 @ 19:51
    Anthony Candaele
    0

    Hi Kim,

    I just did a test, I added the test macro to the macro container and then I added through the macro container an image file.

    If I look at the page where the macrocontainer with the test macro is added, I don't see the image, but when I look in the source code of the rendered page I see this code:

    <textarea><image><File id="1104" version="20890e13-5e66-44df-847b-d87252546b3e" parentID="1103" level="2" writerID="0" nodeType="1033" template="0" sortOrder="1" createDate="2010-12-27T11:23:02" updateDate="2010-12-27T11:23:02" nodeName="actionmaker-logo" urlName="actionmaker-logo" writerName="admin" nodeTypeAlias="File" path="-1,1103,1104"><umbracoFile>/media/202/logo-actionmaker-70x52.jpg</umbracoFile><umbracoExtension>jpg</umbracoExtension><umbracoBytes>2666</umbracoBytes></File></image></textarea>

    So I'm making progress here, from a xslt parser error to something that gets added to the sourcecode :)

    The source code shows that it is the image (actionmaker-logo) that I picked from the media folder

    Anthony

     

  • Anthony Candaele 1197 posts 2049 karma points
    Dec 27, 2010 @ 19:53
    Anthony Candaele
    0

    seems like our posts have crossed, I'll try out the code you created, thanks a lot.

     

    Anthony

  • Kim Andersen 1447 posts 2196 karma points MVP
    Dec 27, 2010 @ 19:56
    Kim Andersen
    1

    Another thing - I can see that you have uploaded your image as a File, and not as an Image. If that's what you are going to do in the future as well, you need to change the $imageid from this:

    <xsl:variable name="imageid" select="/macro/image/Image"/>

    to this:

    <xsl:variable name="imageid" select="/macro/image/File"/>

    Or you could change it to this:

    <xsl:variable name="imageid" select="/macro/image/*"/>

    to make it work with both File and Image.

    /Kim A

  • Anthony Candaele 1197 posts 2049 karma points
    Dec 27, 2010 @ 20:35
    Anthony Candaele
    0

    Hi Kim,

    This indeed saved my problem. My problem was also related to the fact I was using the umbraco.library.NiceUrl method for the link parameter. I forgot that my link parameter was just a normal text string. Because it are external links that get inputted in the widget I didn't choose the content picker datatype.

    So then the widget got rendered in the page, only the image wasn't showing.

    With your last post I also got the image right.

    Seems I still have a lot to learn about Umbraco and Xslt. Well there is a large book at the side of my bed (Jeni Tennison, Xslt 2.0 from Novice to Professional). Think I will do some reading tonight :)

    Thanks for being so patient, this must be the friendliest forum in the world.

    Anthony Candaele
    www.webmove.be
    Belgium

  • Kim Andersen 1447 posts 2196 karma points MVP
    Dec 27, 2010 @ 23:37
    Kim Andersen
    0

    "this must be the friendliest forum in the world." - Yes, I think you are right :)

    I'm glad we got it working. It got a lot easier when I had the code and the issue in front of me instead of just asking for results of various variables etc.

    And the book that you mentioned - it's a good one, I've got the same ;)

    /Kim A

Please Sign in or register to post replies

Write your reply to:

Draft