39569

Cant get the image to show in Umbraco7 with razor

Question:

I have used the media picker as data type for the type, for which the user is going to choose what image they want as the deal image.

But for some reason i can't get the razor syntax to show the image. If I make an If statement to check if the page contains an image then it won't. I think this is a problem that occurs because i have misunderstood something.

My current razor statement:

<img src="@Umbraco.TypedMedia(Model.Content.GetPropertyValue("deal1image")).Url" />

The above code won't show anything.

Hope any of you can guide me to what i do wrong and evt. stuff I'm missing.

This is how my current home.cshtml looks like:

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage @{ Layout = "Master.cshtml"; } <div class="container"> <div class="col-md-4"> <!--Image here--> <img src="@Umbraco.Media(CurrentPage.deal1image).Url" /> <div class="thumbnail thumbnailcustom thumbnailbg1"> <h3>@Umbraco.Field("dealtitle1")</h3>

@Umbraco.Field("dealdescription1")

</div> </div> <div class="col-md-4"> <!--Image here--> <div class="thumbnail thumbnailcustom thumbnailbg2"> <h3>@Umbraco.Field("dealtitle2")</h3>

@Umbraco.Field("dealdescription2")

</div> </div> <div class="col-md-4"> <!--Image here--> <div class="thumbnail thumbnailcustom thumbnailbg3"> <h3>@Umbraco.Field("dealtitle3")</h3>

@Umbraco.Field("dealdescription3")

</div> </div> </div>

Answer1:

You need to use Umbraco.Media to get the media. So like this

<img src="@Umbraco.Media(Model.Content.GetPropertyValue("deal1image").ToString()).Url" />

Or

<img src="@Umbraco.Media(CurrentPage.deal1image).Url" />

Answer2:

An example of using Umbraco.Media:

var myPage = CurrentPage.AncestorsOrSelf().Where("DocumentTypeAlias == @0", "yourPageAlias").First(); Umbraco.Media(myPage.myImage.ToString()).Url

Answer3:

<a href="https://our.umbraco.org/documentation/getting-started/backoffice/property-editors/built-in-property-editors/media-picker" rel="nofollow">Link</a> on <em>OUR Umbraco</em> offers two solutions:

<strong>Typed:</strong>

@if (Model.Content.HasValue("caseStudyImages")) { var caseStudyImagesList = Model.Content.GetPropertyValue<string>("caseStudyImages").Split(new string[] { "," }, StringSplitOptions.RemoveEmptyEntries).Select(int.Parse); var caseStudyImagesCollection = Umbraco.TypedMedia(caseStudyImagesList).Where(x => x != null); foreach (var caseStudyImage in caseStudyImagesCollection) { <img src="@caseStudyImage.Url" style="width:300px;height:300px" /> } }

<strong>Dynamic:</strong>

@if (CurrentPage.HasValue("caseStudyImages")) { var caseStudyImagesList = CurrentPage.CaseStudyImages.Split(new string[] { "," }, StringSplitOptions.RemoveEmptyEntries); var caseStudyImagesCollection = Umbraco.Media(caseStudyImagesList); foreach (var caseStudyImage in caseStudyImagesCollection) { <img src="@caseStudyImage.Url" style="width:300px;height:300px" /> } }

Also, double check your media picker data type alias. Typos are rather common in this part.

Answer4:

This may be a bit clunky compared to other answers but this is what I currently have.

var imageId = Model.Content.GetPropertyValue<int>("eventPoster"); // gets node id var evId = evpId.Id; // gets image id var evMd = Umbraco.Media(evId); // I believe this turns the id into a string var evUrl = evMd.Url; // gets the url of the string

Recommend

  • Azure Storage access from Azure web site
  • EntityFramework enable-migrations ArgumentException
  • Use Hidden field in syncfusion column chart series
  • Custom Animation Object for Transition in Android?
  • Sitecore using Glass mapper and MVC
  • UITableView Multiselect in MonoTouch
  • Model binder ValueProvider appends to the existing value + MVC 4
  • Recursion in ASP.NET Core Razor views
  • MVC extension method error
  • Installing Perl6 and Panda on Ubuntu 15.10. Problems with bootstrap.pl
  • Can my PDF ping my server when it is opened?
  • WPF version of .ScaleControl?
  • Android Activity.onWindowFocusChanged doesn't get called from within TabHost
  • Webgrid not refreshing after delete MVC
  • MVC3 Razor - ListBox pre-select not working
  • Android full screen on only one activity?
  • Refering to the class itself from within a class mehod in Objective C
  • Reading JSON from a file using C++ REST SDK (Casablanca)
  • If I include Java 8 in my Android app does that affect which devices it will work on?
  • formatting the colorbar ticklabels with SymLogNorm normalization in matplotlib
  • FB SDK and cURL: Unknown SSL protocol error in connection to graph.facebook.com:443
  • Accessing IRQ description array within a module and displaying action names
  • Why is the timeout on a windows udp receive socket always 500ms longer than set by SO_RCVTIMEO?
  • Matplotlib draw Spline from multiple points
  • align graphs with different xlab
  • XCode can't find symbols for a specific iOS library/framework project
  • Calling of Constructors in a Java
  • Confusion with PayPal's monthly billing cycle
  • Compare two NSDates in iPhone
  • Is there a mandatory requirement to switch app.yaml?
  • Transpose CSV data with awk (pivot transformation)
  • Use group_by to filter specific cases while keeping NAs
  • log4net write single file for each call to log.info
  • Benchmarking RAM performance - UWP and C#
  • Acquiring multiple attributes from .xml file in c#
  • How to CLICK on IE download dialog box i.e.(Open, Save, Save As…)
  • How can I remove ASP.NET Designer.cs files?
  • UserPrincipal.Current returns apppool on IIS
  • java string with new operator and a literal
  • jQuery Masonry / Isotope and fluid images: Momentary overlap on window resize