Question regarding Content Widget and Url Shape Alternates

Topics: General
Mar 14, 2015 at 1:52 AM
Edited Mar 14, 2015 at 1:53 AM
I have a strange rendering situation going on, hoping someone can provide some guidance...

I have a Page content item with alias my-page-slug.

I have enabled URL Alternates, and created a shape template called Content-Page-url-my-page-slug.cshtml. The shape template looks more or less like

<div id="more-content">
    <h2>More Content</h2>
    <p>Hello here is some more content!</p>
So it just displays the normal Page header and content, and then renders some additional HTML underneath. This all works fine under normal circumstances.

Now I have a need to render a Content Widget in the AsideFirst zone. When I add the widget, it renders properly. However div#more-content also renders into AsideFirst, directly below the Content Widget (as well as in its normal place, in the Content zone).

So it seems that the Content Widget is using my shape template override as well. Am I doing something wrong with alternates? How can I get around this? I definitely need to use a Content Widget (so a plain HTML Widget will not work).

In reality, div#more-content is an angular app and associated scripts. I don't think that is relevant except for I can't just use to hide the version that is rendered in AsideFirst; this is because it doesn't "fully" render in Content - angular is only taking effect in the HTML rendered in AsideFirst.

I'd also rather not make the div#more-content an HTML (or other) widget, because I don't want my content authors messing with it (so would like to leave it in the module).
Mar 14, 2015 at 4:38 PM
Edited Mar 14, 2015 at 4:45 PM
In your Content Widget, use a Custom Display Type e.g "Custom". Then create a "Content-Page.Custom.cshtml" alternate. But, here, you will not get the same Model. You will have to build yourself the display model / shape. At this point you could define, in this newly built model, another metadata alternate to be used and to fit your need, but it's simpler to use a specific dynamic property in this model and only use 2 alternates

So, in "Content-Page.Custom.cshtml", put this code
    var model = BuildDisplay(Model.ContentItem);
    model.Custom = true;
Then, in "Content-Page-url-my-page-slug.cshtml" use this
@if (!(bool)Model.Custom) {
    <div id="more-content">
        <h2>More Content</h2>
        <p>Hello here is some more content!</p>