title: Display Image from Media Library in Umbraco 7
body: <p>This should be something embarrassingly simple, but I can't get it to work: I'd simply like to display an image that was uploaded to the Umbraco Media Library (Umbraco 7.1.1) within a Partial View template. The code is</p>
  
  <pre><code>@inherits Umbraco.Web.Mvc.UmbracoTemplatePage
  @{   
      var imgNode = CurrentPage.BannerBackgroundImage;
      var imgUrl = umbraco.library.NiceUrl(imgNode);
      &lt;div id="banner-wrapper" style="background: url('@imgUrl') center center no-repeat;"&gt;
          &lt;!-- some irrelevant content --&gt;
      &lt;/div&gt;
  }
  </code></pre>
  
  <p>where BannerBackgroundImage is a custom property of the page. When this is displayed, however, the <code>@imgUrl</code> gets replaced with <code>#</code>.</p>
  
  <p>Other alternatives that I've tried are <a href="https://stackoverflow.com/questions/20521471/how-to-show-umbraco-multiple-media-picker-images-on-page-with-a-macro/22220297#22220297">multiple Media Picker images</a>, <a href="https://stackoverflow.com/questions/21732205/how-can-i-display-a-media-picker-image">how to display a Media Picker image</a>, <a href="http://incoders.blogspot.pt/2011/10/get-image-from-media-umbraco-razor.html" rel="nofollow noreferrer">get image from media with Razor</a>, and <a href="http://our.umbraco.org/projects/website-utilities/social-bookmarking-button/general-discussions/19360-Displaying-an-image-from-Media-Picker-in-a-web-page" rel="nofollow noreferrer">display image from Media Picker</a>, to name but a few.</p>
  
  <p>I'd really appreciate if somebody could help me with what I believe is a rookie question!</p>