menus and submenus

Vote:

For a good answer I guess you should take a look at this thread. http://www.episerver.com/en/EPiServer_Knowledge_Center/Developer-Forum2/EPiServer-Developer-Forums-/1805/10965/ In EPiServer CMS the pagetree web control does support an indent/unindent templating, so I guess this kind of structure will be quite easy to create. In EPiServer 4.61 I guess you have to drill down in the example discussed in the link above. Also itemHeader and ItemFooter is supported to allow further modification of each item. Good luck! Mattias Nordgren Sales Engineer

#15199

Apr 05, 2007 9:59

Vote:

I used a similar function to try to have collapsing menus based on CSS. ascx







    
        
            
    
    
        
            <%# GetMenuPageName(Container.CurrentPage) %>
        
            
                
                    
                
                
                    

                        <%# GetMenuPageName(Container.CurrentPage) %>
                    
                        
                            
                                
                            
                            
                                

                                    <%# GetMenuPageName(Container.CurrentPage) %>
                                
                            
                            
                                
                            
                        
                    
                
                
                    
                
            
        
    
    
        
            <%# GetMenuPageName(Container.CurrentPage) %>
        
            
                
                    
                
                
                    

                        <%# GetMenuPageName(Container.CurrentPage) %>

cs


using System;
using System.Text;
using EPiServer;
using EPiServer.Core;

namespace Unctad.Web.Templates.Units
{
	/// 
	///		Summary description for TopMenu.
	/// 
	public partial  class TopMenu : UserControlBase
	{

        public EPiServer.WebControls.MenuList MenuListControl {
            get { return epiMenu; }
        }

		private void Page_Load(object sender, EventArgs e)
		{

			if(!IsPostBack)
				MenuListControl.DataBind();


            //ucPageLink.PropertyName = CurrentPage.PageName;
		}

		protected PageReference MenuRoot  // This should be the container reference to each item in the global menu.
		{
			get
			{
				if(CurrentPage["MainMenuContainer"] != null)
					return (PageReference)CurrentPage["MainMenuContainer"];
				else
					return Configuration.StartPage;
			}
		}
        public string PullDownMenus()
        {
            StringBuilder htmlString = new StringBuilder(50);


            htmlString.Insert(0, "" + Server.HtmlEncode(CurrentPage.PageName));

            PageReference parentReference = MenuRoot; // The parent reference should be the first child in the global navigation.

            // Here should be an iteration of the all the first level sons of the global navigation.
            while (parentReference != PageReference.EmptyReference)
            {
                PageData childPage;
                childPage = GetPage(parentReference);
                htmlString.Insert(0, "");
                htmlString.Insert(0, CreatePageLink(childPage));
                htmlString.Insert(0, "");
                parentReference = MenuRoot; // The parent reference should then change to the second child and so on.
            }

            htmlString.Insert(0, "");
            return htmlString.ToString();

        }


        protected static string GetMenuPageName(PageData pd)
        {
            return pd["varMenu"] != null ? (string)pd["varMenu"] : (string)pd["PageName"];

        }
        private String CreatePageLink(PageData pageObject)
        {
            String pageDisplayName;

            pageDisplayName = pageObject.PageName;
            return "

CSS


/*-- drop down menus:mod -- */
#drpdncontainer             {} /* holds menus for positioning*/
#topmenu div                {} /* holds menus for positioning*/
#drpdn, #drpdn ul           {}
#drpdn a                    {width:15em;text-decoration:none;color:#fff;} /* width needed or else Opera goes nuts */
#drpdn a:hover              {color:#1f4478;background:#fff;} 
#drpdn li                   {text-transform:none !important;} /* all list items;width needed or else Opera goes nuts */
#drpdn li a                 {} 
#drpdn li ul                {width:15em;text-align:left;background:#1f4478;} /* second-level lists */ 
#drpdn li ul li             {width:15em;border-bottom:1px solid #999;} /* second-level lists */ 
#drpdn li ul li a           {width:15em;font-size:11px;font-weight:normal;padding:5px 0 0 5px;border-right:none;} /* second-level lists */ 
#drpdn li:hover ul          {}
#drpdn li ul ul             {margin:-1em 0 0 15em;} /* third-and-above-level lists */
#drpdn li:hover ul ul, 
#drpdn li.sfhover ul ul     {}
#drpdn li:hover ul, #drpdn li li:hover ul, #drpdn li.sfhover ul, #drpdn li li.sfhover ul {}/* lists nested under hovered list items */

#15200

Nov 29, 2007 12:24

Vote:

http://www.episerver.com/en/EPiServer_Knowledge_Center/Developer-Forum2/EPiServer-Developer-Forums-/1805/10965/

The above link is not working. It would be more helpful if you give the right link.

#31280

Jul 17, 2009 12:53

naveedahmad@redweb.com

Vote:

Hi,

I had a similar situation. Consider the following page structure

Product
   Product Category 1
       Product 1.1

   Product category 2
       Product 2.1
       Product 2.2

All I am using is Episerver:Pagelis control as following.

<EPiServer:PageList runat="server" PageLinkProperty="ProductStartPageId" SortOrder="Index" ID="ProductStartPage >

<HeaderTemplate> <h3>Product</h3>



<EPiServer:Property ID="PropertyProductHeading" PropertyName="PageLink" runat="server" />

<ul>

</HeaderTemplate>

<ItemTemplate><li>

    
     <EPiServer:Property ID="Property1" PropertyName="PageName" runat="server" />

    
    <EPiServer:PageList runat="server" PageLink="<%# Container.CurrentPage.PageLink %> " SortOrder="Index" ID="ProductChildStartPage" >
        <HeaderTemplate><ul></HeaderTemplate>
    <ItemTemplate><li><EPiServer:Property ID="Property1" PropertyName="PageLink" runat="server" /></li></ItemTemplate>
    <FooterTemplate></ul></FooterTemplate>
    </EPiServer:PageList>

</li>
</ItemTemplate>

<FooterTemplate></ul></FooterTemplate>

</EPiServer:PageList>

I have created ProductStartPageId as a dynamic property through admin and assigned it the starting page value and used it in the control.

No other custom work required !!!

#31378

Jul 24, 2009 0:55