title: Orchard CMS Custom Shape Template for each Item of a Projection Module
body: <p>I am building a web application using <strong>Orchard</strong>, and I am using <strong>Projection</strong> that generates a list content items defined as <strong><em>Custom Content Type</em></strong> that I gave the name 
  <strong>Cotainer-resource</strong>, this content type contais the fields: <strong>​Title (Input Field)</strong>, <strong>​Description (Text Field)</strong> and <strong>Image Url (Text Field)</strong>.</p>
  
  <p>I would like to format each element of the list to use the shape template bellow.
  I  am using the Bootstrap theme, and I created the file bellow at the 
  <em>~/Themes/Bootstrap/Views/Content-Cotainer-resource.cshtm</em>:</p>
  
  <pre><code>   @using Orchard.Utility.Extensions;
      &lt;div class="container"&gt;
          &lt;div class="container-title"&gt;
              &lt;h2&gt;
                  &lt;span&gt; @Model.ContentItem.TitlePart.Title &lt;/span&gt;
              &lt;/h2&gt;
          &lt;/div&gt;
          &lt;div&gt;
              &lt;div class="container-content"&gt;
                  &lt;div&gt;
                      &lt;div class="container-image"&gt;
                          &lt;a title="Administração" class="image" href="@Model.ContentItem.TitlePart.Title"&gt;
                              &lt;img src="@(Url.Content("../../Resources/images/") + @Model.ContentItem.TitlePart.Title)" alt="container alguma coisa"/&gt;&lt;/a&gt;&lt;/div&gt;
                              @Model.ContentItem.BodyPart.Text
                      &lt;div class="assistir ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only"
                          role="button"&gt;
                          &lt;span class="ui-button-text"&gt;
                              &lt;a href="/Subject/Subject/Index/@Model.ContentItem.Id"&gt;Assistir&lt;/a&gt;&lt;/span&gt;&lt;/div&gt;
                  &lt;/div&gt;
  
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>And my placement.info is:</p>
  
  <pre><code>&lt;Placement&gt;
  
      &lt;Place Parts_Title_Summary="Content:1" /&gt; 
      &lt;Place Fields_Common_Text ="Content:2" /&gt;
      &lt;Place Parts_Common_Body_Summary = "-" /&gt;
      &lt;Place Fields_Input = "-" /&gt;
  
      &lt;Place Parts_Tags_ShowTags = "Content:after.10" /&gt; 
      &lt;Match ContentType="Page"&gt;
          &lt;Place Parts_Common_Metadata="-" /&gt;
      &lt;/Match&gt;
  &lt;/Placement&gt;
  </code></pre>
  
  <p>Using the Shape Tracing from the <a href="http://gallery.orchardproject.net/List/Modules/Orchard.Module.Orchard.DesignerTools/1.4.0" rel="nofollow">Designer Tools 1.4</a> Module I could identify the shape of each element of the list and find where to put the template.
  Using this tool, after selecting an element of the list:</p>
  
  <ol>
  <li><p>I had on the Shape tab:<br>
      Shape    Content
      Active Template  ~/Themes/Bootstrap/Views/Content-Cotainer-resource.cshtml
      Original Template Template  ~/Core/Contents/Views/Content.cshtml
      Display Type   Summary </p></li>
  <li><p>On the template tab I had the template previous described.</p></li>
  <li><p>And on the placement tab:
  <strong>n\a</strong></p></li>
  </ol>
  
  <p>Briefly, what I am trying to do is the same was done with <a href="http://docs.orchardproject.net/Documentation/Creating-lists" rel="nofollow">Creating lists</a> on this tutorial at the <strong>Customizing How the List is Rendered</strong> topic, but using <strong>projection</strong> and instead of customize each field of an item with, customize the entire item with a template file.</p>
  
  <p>Many thanks.</p>