Display Image in List. How in Placement.info?

Mar 2, 2012 at 2:39 PM

Hi Folks,

         I've seen that the image is removed in lists:

     <Match DisplayType="Summary">
      <Place Fields_Contrib_Image="-"/>

         But added for the rests of the Shapes (You see it in item details, for example):       

    <Place Fields_Contrib_Image="Content:before"/>

         How should I modify Placement.info for the image to display in lists?

         I've removed the first code section written up there, and even I tried adding a "Content:before" too, but neither of them is showing me the item image in lists.

         What am I doing wrong? I've no idea, Help Please!


May 27, 2012 at 12:15 AM

Any updates with this? I'm trying to achieve the same thing with no luck.

May 27, 2012 at 3:03 PM
Edited May 27, 2012 at 3:09 PM

There are several ways you can go about this. I tried the same thing. I wanted to have a small thumbnail for each pages in a list of pages. And then a bigger version of the thumbnail actually floated left before the content of the page. I ran around in circles trying to set this up right. And this is where I landed:

Add two new fields for the page,

Thumbnail and PageImage

For every new page, I need to cut a 75x75 and a 250x250 version of the image I want to represent the page, and upload the 75x75 in the thumbnail field, and the 250x250 in the PageImage field.

If you modified the placement.info in the Contrib.ImageField, you need to restore it to the default.

In the placement.info of your prefered theme, add these:

  <Place Fields_Contrib_Image="Content:before.1"/>

  <Match DisplayType="Summary">
    <Place Fields_Contrib_Image-PageImage="-"/>
  <Match ContentType="Content">
    <Place Fields_Contrib_Image-Thumbnail="-"/>
  <Match DisplayType="Summary">
    <Place Fields_Contrib_Image-Thumbnail="Content:1"/>

It took a while to get that just right, as it says Show the thumbnail in the summary, but not in the page. And, show the PageImage in the page, but not in the summary.

And you probably want to remove the "Thumbnail:" part of the rendering. Add a new view in your prefered theme named "Fields.Contrib.Image-Page-Thumbnail.cshtml", and "Fields.Contrib.Image-Page-PageImage.cshtml" with the content:

@using Orchard.Utility.Extensions;

    string name = Model.ContentField.Name;  

@if (!String.IsNullOrWhiteSpace(Model.ContentField.FileName))
<div class="image-field" style="float: left; margin: 5px 10px 10px 0;">
  <img src="@Url.Content(Model.ContentField.FileName)" alt="@Model.ContentField.AlternateText" width="@Model.ContentField.Width" height="@Model.ContentField.Height"/>

Hope this helps!

Oct 2, 2012 at 4:32 PM


Thx soo much you save my life!!!!


but i have a question.... is posible show a image in a windget list?