Copied to clipboard

Flag this post as spam?

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


  • Rose 4 posts 24 karma points
    Nov 02, 2010 @ 11:30
    Rose
    0

    Showing image from media picker and put external link on it

    Hi, I am very new with Umbraco and xslt..so basically I already show image on my web page using media picker and xslt. Now I want to put link to that image which is pointing to another existing website. So, how can I put the link on it?May someone give me clue about xslt for it? Thank you.

  • Rich Green 2246 posts 4008 karma points
    Nov 02, 2010 @ 11:40
    Rich Green
    0

    Let me get this right.

    Are you looking for each image to have a link to another website?

    Rich

  • Yannick Smits 321 posts 718 karma points
    Nov 02, 2010 @ 11:54
    Yannick Smits
    0

    Something like this?

              <a href="{umbraco.library:NiceUrl(@id)}">

                <img alt="{@nodeName}">

                  <xsl:attribute name="src">

                    <xsl:value-of select="$urlPrefix"/>

                    <xsl:text>/umbraco/ImageGen.ashx?image=</xsl:text>

                    <xsl:value-of select="data [@alias = 'Picture']"/>

                    <xsl:text>&amp;width=100</xsl:text>

                  </xsl:attribute>

                </img>

              </a>

  • Rich Green 2246 posts 4008 karma points
    Nov 02, 2010 @ 11:57
    Rich Green
    0

    You need to add a new property to your image, 

    Settings - Media Types - Image  - Generic Properties

    Add a field named 'link' and then you can access this property in the same way you access other media properties.

    Rich

  • Rich Green 2246 posts 4008 karma points
    Nov 02, 2010 @ 13:00
    Rich Green
    0

    Rose,

    Yannicks solution will work, and is probably the preferred solution, unless you want the image hold the link and not the doc type with the media picker on, if that makes sense?

    Rich

  • Rose 4 posts 24 karma points
    Nov 03, 2010 @ 06:09
    Rose
    0

    Hi, thanks for the help, Yannicks and Rich,

    I basically want my user to be able to put image from media picker and then put link related to the image. so each image will link to another website.

    I'm struggling in where my user can put link to be attached to the image..may I have help on this? Thanks

  • Rich Green 2246 posts 4008 karma points
    Nov 03, 2010 @ 07:54
    Rich Green
    0

    Hi Rose,

    You can just add the link where I state in my post above. Please let me know if there is something that you don't understand in my post.

    Rich

  • Rose 4 posts 24 karma points
    Nov 03, 2010 @ 08:47
    Rose
    0

    Thanks Rich,

    from Settings - Media Types - Image  - Generic Properties, I add new property named Link, type: related link.

    And so in media section I can put external link to my image. But then how to put it in the xslt? And will my image be clickable to another website? 

    thanks

  • Rich Green 2246 posts 4008 karma points
    Nov 03, 2010 @ 09:26
    Rich Green
    0

    Just make it a textstring, not a related link.

    Then in your XSLT you just access this the same way as your media

    As you don't mention which version of Umbraco you are using, or have not posted any of the code you have tried it's difficult to help you.

    However you could try this (pre 4.5)

     <xsl:variable name="mediaId" select="number($currentPage/data[@alias='mediaId'])" />
    
        <xsl:if test="$mediaId &gt; 0">
    
            <xsl:variable name="mediaNode" select="umbraco.library:GetMedia($mediaId, 0)" />
    
           <xsl:if test="count($mediaNode/data) &gt; 0 and string($mediaNode/data[@alias='umbracoFile']) != ''">
    
                <a href="{$mediaNode/data[@alias='link']}" target="_blank"><img src="{$mediaNode/data[@alias='umbracoFile']}" height="{$mediaNode/data[@alias='umbracoHeight']}" width="{$mediaNode/data[@alias='umbracoWidth']}" /></a>
    
           </xsl:if>
    
        </xsl:if>
    

    Or for Umbraco 4.5 and above

     <xsl:variable name="mediaId" select="number($currentPage/mediaId)" />
    
        <xsl:if test="$mediaId > 0">
    
            <xsl:variable name="mediaNode" select="umbraco.library:GetMedia($mediaId, 0)" />
    
            <xsl:if test="$mediaNode/umbracoFile">
    
                <a href="{$mediaNode/link}" target="_blank"><img src="{$mediaNode/umbracoFile}" alt="[image]" height="{umbracoHeight}" width="{umbracoWidth}" /></a>
    
            </xsl:if>
    
        </xsl:if>

    Rich

  • Rose 4 posts 24 karma points
    Nov 03, 2010 @ 11:00
    Rose
    0

    Sorry I didn't mention, I'm using Umbraco 4.5.2.. Thanks so much, Rich. it works! :)

  • Marten Renkema 5 posts 75 karma points
    Mar 30, 2016 @ 12:01
    Marten Renkema
    0

    Hi guys,

    Picking up an old thread, but I have the same question regarding Umbraco version 7. I would like to have my editors add hyperlinks on images picked from the media picker.

    Same procedure as above? So can I forward this thread to our programmer?

    Thanks, Marten

    PS: I added the link property to hande this from the back-office (Media), but that does not work for some reason. I also created a textstring property now.

Please Sign in or register to post replies

Write your reply to:

Draft