Images on the same page

Topics: Administration, Core, Customizing Orchard, General, Localization, Nederlands (Dutch), Troubleshooting
Mar 3, 2013 at 2:21 PM
Edited Mar 3, 2013 at 2:21 PM
Hi everybody,

I have this: http://www.antiekbrocante.nl/kristal-collectie

But then you have to click on more to see the images , but it has to be that the images will appear on the same page as titel and omschrijving.

THX
Developer
Mar 3, 2013 at 5:38 PM
It's hard to tell without knowing the content type definitions, but you can use Placement.info to determine which shapes get rendered where for which display type. So if the images are MediaPickerFields, you can add an entry to Placement.info to have its shape render for the Summary display type.
Mar 3, 2013 at 5:44 PM
Hi,

My placement.info looks now like this:

<Placement>
<Match ContentType="Event">
<Match DisplayType="Summary">
<Place Fields_Text="Content:before">
</Place>
<Place Fields_DateTime="Content:before">
</Place>
</Match>
</Match>
</Placement>
Developer
Mar 3, 2013 at 6:53 PM
Ok. And your images, how are these implemented? Are they fields or part of the body of the Event type or something else?
Mar 3, 2013 at 9:08 PM
Edited Mar 3, 2013 at 9:08 PM
I made a new projection file from the dashboard. and then I have a titel, Omschrijving, and three images, they have to be allined vertical and not horizontal what it now is.

I have the next files for allining the images: the name of the file is: MediaPicker-plaatjeZilver.cshtml
@using Orchard.Utility.Extensions;
@{
    string name = Model.ContentField.Name;
    string url = Model.ContentField.Url;
    string alignment = Model.ContentField.Alignment;
}
@if (!String.IsNullOrWhiteSpace(url)) {
    
  <a href="@Href(url)" target="_blank"><img src="@Href(url)" alt="@Model.ContentField.AlternateText" style="margin-bottom:10px;" class="media-picker-field media-picker-field-@name.HtmlClassify()"/></a>
  
   
        
}
and then I have for image 2: MediaPicker-plaatjeZilver2.cshtml
@using Orchard.Utility.Extensions;
@{
    string name = Model.ContentField.Name;
    string url = Model.ContentField.Url;
    string alignment = Model.ContentField.Alignment;
}
@if (!String.IsNullOrWhiteSpace(url)) {
    
  <a href="@Href(url)" target="_blank"><img src="@Href(url)" alt="@Model.ContentField.AlternateText" style="margin-bottom:10px" class="media-picker-field media-picker-field-@name.HtmlClassify()"/></a>
    
   
}
And I have the files in folder: Themes - BrocanteLayout - Views - Fields
Developer
Mar 3, 2013 at 11:53 PM
Ok, so in order to have these things render in Summary view as well, you will have to add a couple of <Place> elements to your Placement.info file.
For example, to have the Fields_MediaPicker-plaatjeZilver2 shape render, add this:
<Placement> 
    <Match ContentType="Event"> 
        <Match DisplayType="Summary"> 
            <Place Fields_MediaPicker-plaatjeZilver2="Content:after"> 
        </Match>
     </Match>
</Placement>
Mar 4, 2013 at 6:55 PM
You mean like this?
<Placement>
<Match ContentType="Event">
<Match DisplayType="Summary">
<Place Fields_Text="Content:before">
</Place>
<Place Fields_DateTime="Content:before">
</Place>
</Match>
</Match>
</Placement>

<Placement> 
    <Match ContentType="Event"> 
        <Match DisplayType="Summary"> 
            <Place Fields_MediaPicker-plaatjeZilver2="Content:after"> 
        </Match>
     </Match>
</Placement>
But that doesnt work
Developer
Mar 4, 2013 at 8:19 PM
That's most likely because that's an invalid XML document. Try this:
<Placement>
<Match ContentType="Event">
<Match DisplayType="Summary">
<Place Fields_Text="Content:before">
</Place>
<Place Fields_DateTime="Content:before">
</Place>
</Match>
</Match>

<Match ContentType="Event"> 
        <Match DisplayType="Summary"> 
            <Place Fields_MediaPicker-plaatjeZilver2="Content:after"> 
        </Match>
     </Match>

</Placement>
Mar 4, 2013 at 9:39 PM
But then I still get an error:

The 'Place' start tag on line 13 position 14 does not match the end tag of 'Match'. Line 14, position 11.
Developer
Mar 5, 2013 at 12:55 AM
Edited Mar 5, 2013 at 12:55 AM
Sorry, my mistake. I copied over your invalid XML.
Try again:
<Placement>
    <Match ContentType="Event">
        <Match DisplayType="Summary">
            <Place Fields_Text="Content:before" />
            <Place Fields_DateTime="Content:before" />
        </Match>
    </Match>

    <Match ContentType="Event">
        <Match DisplayType="Summary">
            <Place Fields_MediaPicker-plaatjeZilver2="Content:after" /> 
        </Match>
    </Match>

</Placement>
Mar 5, 2013 at 7:14 PM
Oke,

I have it now like this:
<Placement>
    <Match ContentType="Event">
        <Match DisplayType="Summary">
            <Place Fields_Text="Content:before" />
            <Place Fields_DateTime="Content:before" />
        </Match>
    </Match>

    <Match ContentType="Event">
        <Match DisplayType="Summary">
            <Place Fields_MediaPicker-plaatjekristal="Content:after" /> 
        </Match>
    </Match>

</Placement>
But the images are still on the other page: look at: http://www.antiekbrocante.nl/kristal-collectie

And also the title is as link?? But I added fields: title as textbox, omschrijving as textbox and three images as MediaPicker. So how it can that it is an link?

And then I have for example 10 categories: zilver, Cristal.. etc. and an title and omschrijving. And on every title: title1, title2 with omschrijving ofcours I want three pictures. Like this: plaatjekristal, plaatjekristal2, plaatjekristal3, etc I have to put it all in placement.info?
Developer
Mar 7, 2013 at 1:03 AM
It's hard to tell without seeing the templates and content type definitions.
The way it works is that the shapes can be placed using Placement.info. Make sure you are using the correct shape names (use the Shape Tracer to find out what the shape names are)
Shapes are rendered using templates. You can override templates to customize how things are rendered.

Although I don't think it causes an issue, but you can merge the two elements in Placement.info like this:
<Placement>
    <Match ContentType="Event">
        <Match DisplayType="Summary">
            <Place Fields_Text="Content:before" />
            <Place Fields_DateTime="Content:before" />
            <Place Fields_MediaPicker-plaatjekristal="Content:after" /> 
        </Match>
    </Match>
</Placement>
Developer
Mar 7, 2013 at 1:06 AM
If you attach multiple fields of a specific type, like MediaPickerField, you don't have to include their names if you want all Fields_MediaPicker shapes to be placed in a specific zone for a specific display type for a specific type. Simply remove the name suffix. E.g.
<Placement>
    <Match ContentType="Event">
        <Match DisplayType="Summary">
            <Place Fields_Text="Content:before" />
            <Place Fields_DateTime="Content:before" />
            <Place Fields_MediaPicker="Content:after" /> 
        </Match>
    </Match>
</Placement>
Mar 7, 2013 at 3:13 PM
HI,

Iv also sent the web.config file. Maybe you know why the site: antiekbrocante.nl is so slow? the issue is: http://orchard.codeplex.com/discussions/435210#post1009588

Did you visit the site: www.antiekbrocante.nl? To see that it is slow. But it will be slowly when you visit the site for the first time and if you didnt visit the site for some time. Because if you visit the site and you click on some links then the site is faster.

THX for helping.

Niels.
Coordinator
Mar 7, 2013 at 6:21 PM
It's impossible to say without spending time on your server. It could be any or many of those, and more: slow server, too many sites running on that server, not enough memory, too many modules installed, a bad module that does stupid things, an unfortunate configuration that hits a bottleneck, lack of caching, etc., etc. Profile it.