Copied to clipboard

Flag this post as spam?

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


  • Jonas Persson 12 posts 42 karma points
    Apr 23, 2010 @ 11:55
    Jonas Persson
    0

    Insert image from medialibrary & assign internal link

    Hi!
    This is a simple one for you gurus I think :)
    I need to in the doctype choose an image from the medialibrary, and then assin an internal link to it.
    I´ve used Mediapicker for the image and the content picker for the link.

    I just can´t get the contenpicker to assign the link?

    This is what I want:

     <a href="#">
    <img src="images/banner/Banner_2.jpg" width="320" height="145" border="0"/>
    </a>


    This is how far i got:it:

    <a href="#">    
    <umbraco:Item runat="server" field="banner_1_bild" xslt="concat('&lt;img src=&quot;',umbraco.library:GetMedia({0}, true())/data[@alias='umbracoFile'], '&quot; width=&quot;320&quot; height=&quot;145&quot; border=&quot;0&quot;  /&gt;')" xsltDisableEscaping="true"/>
    </a>

     

    Any ideas? :)

  • Tobias Neugebauer 52 posts 93 karma points
    Apr 23, 2010 @ 12:14
    Tobias Neugebauer
    0

    Hi,

    it could work if you use pageID in the field attribute and then access your properties with $currentPage/data[@alias='YOUR_ALIAS'].

    Don't know if this works if highlighted my changes:

    <umbraco:Item ID="Item1" runat="server" field="pageID" xslt="concat('%lt;a href=&quot;', umbraco.library:NiceUrl($currentPage/data[@alias='YOUR_LINK_ALIAS]'),'&gt;', '&lt;img src=&quot;',umbraco.library:GetMedia($currentPage/data[@alias='banner_1_bild'], true())/data[@alias='umbracoFile'], '&quot; width=&quot;320&quot; height=&quot;145&quot; border=&quot;0&quot;  /&gt;&lt;a&gt;')" xsltDisableEscaping="true"/>

    Hope this helps

    Toby

  • Jonas Persson 12 posts 42 karma points
    Apr 27, 2010 @ 09:07
    Jonas Persson
    0

    Hi
    I can´t get this to work :(
    The "aliases" of the

    Mediapicker is:  banner_1_bild
    &
    content picker : banner_1_lank

    The idea is that you pick an image from the media library and when it´s clicked i want to go to an internal url.

    Is there any other way to achieve this?

  • bob baty-barr 1180 posts 1294 karma points MVP
    Apr 27, 2010 @ 16:13
    bob baty-barr
    0

    surely there is... i often have a property on page called pageImage... i use an xslt macro to render that image to the page, usually in a template, but let's look at some macro code that could do what you want. Below is a complete xslt that i have used that does a couple of things...

    1. if the user pics a media folder, it lists all the images from that folder

    2. if only one image is picked, it renders it to screen and includes the link element if a link is selected...

    now, caveat here is that i have the content picker on the media node itself, but we can address that below the code... so here goes.

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp "&#x00A0;"> ]>
    <xsl:stylesheet
        version="1.0"
        xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
        xmlns:msxml="urn:schemas-microsoft-com:xslt"
        xmlns:msxsl="urn:schemas-microsoft-com:xslt"
        xmlns:lk="http://leekelleher.com" xmlns:umbraco.library="urn:umbraco.library" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets" xmlns:tagsLib="urn:tagsLib" xmlns:BlogLibrary="urn:BlogLibrary" xmlns:CWSHelper.twitter="urn:CWSHelper.twitter"
        exclude-result-prefixes="lk msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets tagsLib BlogLibrary CWSHelper.twitter ">


    <xsl:output method="xml" omit-xml-declaration="yes"/>

    <xsl:param name="currentPage"/>

    <msxsl:script language="JavaScript" implements-prefix="lk">
            function Random(r) { return Math.ceil(Math.random()*r); }
        </msxsl:script>

    <xsl:template match="/">

    <!-- start writing XSLT -->
    <xsl:choose>
        <xsl:when test="$currentPage/data [@alias = 'pageImage'] != ''">
            <xsl:variable name="imageNode" select="$currentPage/data[@alias='pageImage']"/>
            <xsl:variable name="imageData" select="umbraco.library:GetMedia($imageNode,0)/data [@alias = 'umbracoFile']"/>
            <xsl:variable name="imageLink" select="umbraco.library:GetMedia($imageNode,0)/data [@alias = 'picLink']"/>
                <xsl:choose>
                    <xsl:when test="$imageLink !=''">
                   
                        <a href="{umbraco.library:GetMedia($imageLink,0)/data [@alias = 'umbracoFile']}" class="viewDoc"><img src="/umbraco/imagegen.ashx?image={$imageData}&amp;width=300&amp;constrain=true" /></a>
                    </xsl:when>
                    <xsl:otherwise>
                        <img src="/umbraco/imagegen.ashx?image={$imageData}&amp;width=300&amp;constrain=true" />
                    </xsl:otherwise>
                </xsl:choose>

           
        </xsl:when>
        <xsl:otherwise>
            <xsl:if test="$currentPage/data [@alias = 'imagesFolder'] != ''">
                <div id="pageGallery">
                    <xsl:variable name="images" select="number($currentPage/data [@alias = 'imagesFolder'])"/>
                    <xsl:variable name="maxItems" select="count(umbraco.library:GetMedia($images, 'true')/node)"/>
                            <xsl:for-each select="umbraco.library:GetMedia($images, 'true')/node">
                            <xsl:sort select="lk:Random($maxItems)" order="descending" />
                                <xsl:variable name="picFile" select="concat('/umbraco/imageGen.aspx?image=',./data[@alias='umbracoFile'],'&amp;width=300&amp;height=300&amp;constrain=true')"/>
                   

                                    <div class="smPicSlide" style="text-align: center;">
                                        <img src="{$picFile}" alt=""/>
                                    </div>

                            </xsl:for-each>

                </div>

            </xsl:if>
        </xsl:otherwise>
    </xsl:choose>


    </xsl:template>

    </xsl:stylesheet>

    So, let's look at the linking stuff...

    <xsl:variable name="imageLink" select="umbraco.library:GetMedia($imageNode,0)/data [@alias = 'picLink']"/>
                <xsl:choose>
                    <xsl:when test="$imageLink !=''">
                   
                        <a href="{umbraco.library:GetMedia($imageLink,0)/data [@alias = 'umbracoFile']}" class="viewDoc"><img src="/umbraco/imagegen.ashx?image={$imageData}&amp;width=300&amp;constrain=true" /></a>
                    </xsl:when>
                    <xsl:otherwise>
                        <img src="/umbraco/imagegen.ashx?image={$imageData}&amp;width=300&amp;constrain=true" />
                    </xsl:otherwise>
                </xsl:choose>

    I am setting a variablebased on the media item... you would simply set it based on $currentPage/data[@alias='picLink']

    then you would use umbraco.library:NiceUrl($imageLink) to generate your link variable like this...

    <a href="{umbraco.library:NiceUrl($imageLink)" class="viewDoc"><img src="/umbraco/imagegen.ashx?image={$imageData}&amp;width=300&amp;constrain=true" /></a>

    Please NOTE my code uses the most EXCELLENT IMAGEGEN to size the images....

    hope that helps.

  • 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