This project is read-only.

Odd shape tracing behaviour - Rendering zones from templates

Topics: Customizing Orchard, Writing modules
Aug 26, 2011 at 4:40 PM


I've tried some of the interesting zone manipulation stuff that Bertrand has spoken about in his blogs and then I extended it a little. We have a part that has a number of fields, but the fields really need to be rendered inside the part. What I've done is used a specialised alternate for each of them (eg Custom.RelatedItems-Author.cshtml) and rendered the important bits to zones like so:

    var zone = WorkContext.Layout.Zones["AuthorName"];
    zone.Add(Model.First.PersonPart.Name.Value, "1");

    zone = WorkContext.Layout.Zones["AuthorImage"];
    zone.Add(Model.First.PersonPart.Image.Url, "1");

Then in the part's template:



To display the fields.
I've overridden the zone templates too with:
    IEnumerable<dynamic> children = Model;
    foreach (var child in children)
 (Strangely @Display(child) didn't work)

My real question follows :)
The AuthorName is fine. It comes out as it should.
The AuthorImage has shape tracing tags around it when I render it in the img src attribute. Or anywhere inside a tag. If I just Author Image: @AuthorImage then I get the URL on it's own, but putting anything around it adds the shape tracing tags. I've spent most of the day looking at how to get rid of them, so I think I'll turn to you now! Where is it coming from?

Any help much appreciated.

Aug 26, 2011 at 6:56 PM

If AuthorImage is just a URL, don't make it a shape. In any case, there is some info missing here which makes it confusing: where does the img tag come from for example?

Aug 26, 2011 at 10:05 PM

In the part template there is:

<img src="@Display(WorkContext.Layout.AuthorImage)" />

Which I would have thought would render as:

<img src="~/Media/Default/Images/test.png" />

but is instead being rendered as:

<img src="
  <script class="shape-tracing-wrapper" shape-id="11" shape-type="Zone" shape-hint="AuthorImage"></script><script class="shape-tracing-wrapper" end-of="11"></script>
  " /> 


How do I render it to another zone without making it a shape?

Aug 26, 2011 at 10:18 PM

Yes, it makes no sense for AuthorImage to be a zone. What I would do is store AuthorImage as a string on Layout:

WorkContext.Layout.AuthorImage = Model.First.PersonPart.Image.Url;

and then just inject that:

<img src="@WorkContext.Layout.AuthorImage" />
Aug 26, 2011 at 10:28 PM


So simple when you know how :)

I think this little insight will be what it takes to get this working in harmony with the front end guys.

Thank you again!