Mapping ContentViewDesigners and working with Presentation Modes

February 23, 2009 Digital Experience

[This post is part of the developer's manual preview published on this blog. You can find temporary TOC here.]


[This article requires Sitefinity 3.6 hotfix to be installed] 

 

So far we have seen all the major ways in which one can map embedded templates to use external ones, however, we did not talk about one of the special cases - ContentViewDesigner templates.

 

ContentViewDesigners are controls which provide users with a user friendly and dynamic way of setting up numerous properties of ContentView based controls. Following three controls have their implementations of ContentViewDesigners and they will be the focus of this article:
  • BlogPosts
  • NewsView and
  • EventsView
In case you are a bit unclear on how exactly ContentViewDesigner implementation looks like, take a look at the following image depicting the ContentViewDesigner implementation for the BlogPosts control - BlogPostDesigner.

 


 

You can find out more about ContentView designers in a five piece series published on this blog:
Without going into too much detail about ContentViewDesigners in this post, we will examine only the two topics that are of interest in this context.
  • How to map ContentViewDesigner template to an external one and
  • How to map PresentationMode templates to external ones

How to map ContentViewDesigner template to an external one


Mapping a ContentViewDesigner template is no different than mapping any other embedded template, just as we have demonstrated in this article. The following example shows how to map all there ContentViewDesigners to use external templates:

 

<?xml version="1.0" encoding="utf-8"?><controlsConfig> 
  <viewMap> 
    <!--Provides user interface for setting up the BlogPosts control designer in the blogs module.--> 
    <viewSettings hostType="Telerik.Blogs.WebControls.Design.BlogPostsDesigner" layoutTemplatePath="~/Sitefinity/Admin/ControlTemplates/Blogs/BlogPostsControlDesigner.ascx" /> 
 
    <!--Events View Designer Template--> 
    <viewSettings hostType="Telerik.Events.WebControls.Design.EventsViewDesigner" layoutTemplatePath="~/Sitefinity/Admin/ControlTemplates/Events/EventsViewControlDesigner.ascx" /> 
 
    <!--Provides user interface for NewsViewDesigner control which allows modifications of NewsView designer.--> 
    <viewSettings hostType="Telerik.News.WebControls.Design.NewsViewDesigner" layoutTemplatePath="~/Sitefinity/Admin/ControlTemplates/News/NewsViewControlDesigner.ascx" /> 
  </viewMap> 
</controlsConfig> 
 

 

 

By doing so we have successfully mapped all designers to external templates and are now able to modify them.

 


How to map PresentationMode templates to external ones


If you are unsure of the purpose of the ContentView designers and how they affect the templates of controls they design you can check this article to refresh your memory. Now that we know how ContentViewDesigners influence template of the the controls they design let’s examine one presentation mode:

 

<sf:PresentationMode ID="listPageMode" runat="server"  
                                               ModeTitle="List &amp; page EXTERNAL"  
                                               ModeSettingsId="ModesSettings1"  
                                               MasterTemplateName="Telerik.Blogs.Resources.ControlTemplates.Frontend.Modes.ListPageMaster.ascx" 
                                               DetailTemplateName="Telerik.Blogs.Resources.ControlTemplates.Frontend.Modes.ListPageDetail.ascx" 
                                               CssClass="pageListMode" 
                                               SelectedCssClass="selectedOption pageListMode" 
                                               > 
                        <Template> 
                                <asp:RadioButton ID="listPageRadio" runat="server" /> 
                                <p>A list of all posts plus separate pages for each post.</p> 
                             
                        </Template> 
                    </sf:PresentationMode> 
 

So, when selected this mode will automatically make the BlogPost control to use embedded templates for its Master and Detail template. This is because designer specifies properties
  • MasterTemplateName and
  • DetailTemplateName
In order to change this behavior and make the designer to set external templates when mode is selected all we need to do is replace the MasterTemplateName and DetailTemplateName properties with MasterTemplatePath and DetailTemplatePath properties respectively. Therefore we will modify the designer in following manner:

 

<sf:PresentationMode ID="listPageMode" runat="server"  
                                               ModeTitle="List &amp; page EXTERNAL"  
                                               ModeSettingsId="ModesSettings1"  
                                               MasterTemplatePath="~/Sitefinity/Admin/ControlTemplates/Blogs/Modes/ListPageMaster.ascx" 
                                               DetailTemplatePath="~/Sitefinity/Admin/ControlTemplates/Blogs/Modes/ListPageDetail.ascx" 
                                               CssClass="pageListMode" 
                                               SelectedCssClass="selectedOption pageListMode" 
                                               > 
                        <Template> 
                                <asp:RadioButton ID="listPageRadio" runat="server" /> 
                                <p>A list of all posts plus separate pages for each post.</p> 
                             
                        </Template> 
                    </sf:PresentationMode> 
 

And there we are, we have mapped both the BlogPostDesigner template and the presentation mode templates to use external templates.

 

Dev Manual Preview external templates

The Progress Team