Copied to clipboard

Flag this post as spam?

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


  • Larry 2 posts 22 karma points
    Jan 08, 2012 @ 10:02
    Larry
    0

    properties type upload rendering path instead of image

    Hello.

    I am new to Umbraco and have istalled version 4.7.1 via webmatrix.

    I have been following the video tuts on Umbraco TV and have run into an issue when using the properties type upload. In my document types I created a simplePage, on that page I want to show an image. As showed in the tuts that I followed, all that needs to be done is to add a property of type upload.

    Next in the template I insert the Umbraco page field.  <umbraco:Item field="testImage" runat="server" />

    That done, great, when I go to the content section and open my simplePage I am in effect able to upload an image that will be used in the page.

    Upload process works pretty good. The image I want is uploaded into the file /media/166/img_05.jpg

    The problem is when I view the site in my browser and go to simplePage where I should see my image all I see is the image path written on the page (/media/166/img_05.jpg).

    I aslo tryed to use the type: media picker to upload an image nearly the same problem only difference is instead of the path I get what seems to be the ID of the image.

    In both casses the image that needs to be rendered on the page isn't showing.

    I then tryed the good old fashon way (simple html) to show the image and it works. So its not a problem of findig or accessing the image file.

    Below is the output of the page when I view the source of the page that uses the Umbraco page field and the simple html variants.

    <p>Page <strong>d'accueil</strong> du site Cosyfood</p>

    /media/166/img_05.jpg      <-- (this is what the Umbraco page field renders, instead of the image)

    <div>

    <img src="/media/166/img_05.jpg" alt="cosyfood" />

    </div>

     

    Thanks in advance for any help on this one.

    Regards

     

  • Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib
    Jan 08, 2012 @ 10:51
    Jan Skovgaard
    0

    Hi Larry and welcome to our :)

    The behaviour you're seeing is completely correct. The upload property should only return the path. In order to get an image rendered you need to put the path in the <img> tag yourself. Keep in mind that the upload field can contain any kind of file and it's not sure you want to render a image everytime - in som cases you just want to render a link to the image.

    So in order to render the image you will need to do the following in your template.

    <div>

    <umbraco:Item field="testImage" insertTextBefore="&lt;img src=&quot;" insertTextAfter="&quot; alt=&quot;&quot; &gt;" runat="server" />

    </div>

    However I don't feel this is the right way to do it, since it's a bit ugyly and a bit hackish

    You should consider using XSLT or Razor macroes to render the output.

    You can also use an inline xslt rendering like this:
    <umbraco:Item runat="server" field="testImage" xslt="concat('&lt;img src=&quot;',umbraco.library:GetMedia({0}, true())/umbracoFile, '&quot; /&gt;')" xsltDisableEscaping="true"/>

    You can read more about inline XSLT renderings here http://our.umbraco.org/wiki/reference/templates/umbracoitem-element/inline-xslt

    I will also recommend that you install the CWS (Creative Website stater) package, which you can play around with and figure out how Umbraco is working.

    Hope this helps you.

    /Jan

Please Sign in or register to post replies

Write your reply to:

Draft