Displaytemplate just renders links


Dear friends,

I've been trying to implement a display template for images and then use this template in a block. The problem is that no images is rendered, just the url to the image.


I've created a newsblock with a image property like this:

public virtual ContentReference Image { get; set; }


My NewsblockController looks like this:

public class NewsBlockController : ActionControllerBase, IRenderTemplate<NewsBlock>
        public ActionResult Index(NewsBlock currentBlock)
            var model = new NewsBlockViewModel(currentBlock.Heading, currentBlock.MainIntro, currentBlock.NewsRoot, currentBlock.Image);

            return PartialView(model);


And my NewsblockView looks like this:

@model HiQAllehanda.Models.ViewModels.NewsBlockViewModel

<div class="newsblock">
          <h1>@Html.PropertyFor(x => x.Heading)</h1>
          @Html.PropertyFor(m => m.Image


In my Views folder i have created a new folder called DisplayTemplates and in this folder a Image.cshtml file that looks like this:

@model EPiServer.Core.ContentReference

@if(Model != null)
    <img src="@Url.ContentUrl(Model)" alt="" />

Apr 29, 2014 10:11

You can define your property like this:

public virtual Url Image { get; set; }


And use the following code in your DisplayTemplate:

@model EPiServer.Url
@if (Model != null)
    <img src="@Url.ContentUrl(Model)" alt="" />


Hope this helps

Apr 29, 2014 10:32

I still just get the link to the image :(

Apr 29, 2014 11:12

Try moving your display templates to the /Views/Shared folder

Apr 29, 2014 11:40

Now i've tried to move my Image.cshtml file to /Views/Shared folder but still just the link.

Apr 29, 2014 12:48

It should be /Views/Shared/DisplayTemplates/Image.cshtml

Apr 29, 2014 12:55

That's what i had from the beginning.

Apr 29, 2014 13:03

In my Views folder i have created a new folder called DisplayTemplates and in this folder a Image.cshtml file that looks like this:

Are you sure? Seems to me that you did not put it in the "shared" folder, but maybe I misunderstood. 

Apr 29, 2014 13:12

I've come across something similar and it looked to me as if image renderers are only used for rendering MediaTypes (ie images) when they are used in Content Areas. Using the EPiServer PropertyFor helper / EPiServer Property control with an Image property didn't use the custom rendering tempate. I'm not sure whether this is a bug or by design.

Try dropping your image in a content area and see what happens.

Apr 29, 2014 16:06

It was me that was unclear when writing, my DisplayTemplates folder was under the Shared folder.

Apr 29, 2014 16:40

Mark - What do you mean by dropping the image in a content area?

Apr 29, 2014 16:45

Have you added a UiHint to the image property on your NewsBlockViewModel?

Apr 29, 2014 18:42

By that I mean - add a content area property to your NewsBlock and add the content area to the NewsBlock View. Then using the edit UI add the Image to the content area in your NewsBlock by dragging and dropping

Apr 29, 2014 19:26

Per Magne - Not on the NewsBlockViewModel.


My NewsBlock.cs looks like this:

 public virtual Url Image { get; set; }


My NewsBlockViewModel looks like this:

public string Heading { get; set; }
public string MainIntro { get; set; }
public ContentReference NewsRoot { get; set; }
public IEnumerable<PageData> NewsPages { get; set; }
public Url Image { get; set; }

public NewsBlockViewModel(string heading, string intro, ContentReference contentReference, Url image)
     Heading = heading;
     MainIntro = GetSubString(intro);
     NewsRoot = contentReference;
     NewsPages = GetNewsPages();
     Image = image;            

Apr 30, 2014 10:05

You should add it to the view model as well. Otherwise it will not know which display template to load, and will load the default one, which just displays the url in this case

Edited, Apr 30, 2014 10:08

Great, adding the UiHint to the viewmodel did the trick! Thanks to all of you for helping me!

Apr 30, 2014 11:27
This topic was created over six months ago and has been resolved. If you have a similar question, please create a new topic and refer to this one.
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.