volume_up

A critical vulnerability was discovered in React Server Components (Next.js). Our systems remain protected but we advise to update packages to newest version. Learn More

volume_up

A critical vulnerability was discovered in React Server Components (Next.js). Our systems remain protected but we advise to update packages to newest version. Learn More

Sitemap in CMS5

What's the easiest way to build a Sitemap in CMS5, similar to the Sitemap Control i EPiServer 4 with multiple column support?

/Jonas

#23554
Sep 09, 2008 15:04
Hi jonas, did you managed to solve this issue, having the same problem //Diego
#26156
Nov 23, 2008 12:31

<EPiServer:PageTree id="siteMapPageTree" NumberOfLevels="5" ExpandAll="true" EnableVisibleInMenu="true" PageLink="3" runat="server">
    <IndentTemplate>
        <ul class="SiteMap">
    </IndentTemplate>
    <ItemHeaderTemplate>
            <li>
    </ItemHeaderTemplate>
    <ItemTemplate>
                <EPiServer:Property PropertyName="PageLink" runat="server" />
    </ItemTemplate>
    <ItemFooterTemplate>
            </li>
    </ItemFooterTemplate>
    <UnindentTemplate>
        </ul>
    </UnindentTemplate>
</EPiServer:PageTree>

The column handling is done with css:

<style>
    ul.SiteMap
    {
        margin: 0;
    }

    ul.SiteMap li
    {
        float: left;
        width: 24%;
        margin: 0 1% 0 0;
        list-style: none;
    }

    ul.SiteMap ul 
    {
        margin-left: 10px;
        padding-left: 10px;
        border-left: 1px solid #ccc;
    }

    ul.SiteMap li ul li
    {
        float: none;
        width: 100%;
    }
</style>

The width attribute of "ul.SiteMap li", that is 24%, makes it a four column. How this style will work for you is of course dependent on how your other css are built. But I hope you understand the idea.

/Hans

#26162
Nov 24, 2008 10:13

Hi hans,

 I tryed to put in a "NumberOfLevels" attribute in the page tree but that inly works wor Episerver 4.x code. I ended up using a function inside the Ordered (SortOrder)pagetree determining witch PageName I was under (CurrentPage.PageName) and from there adding a TD tag if I wanted a new column or not according to the following code:

   <table border="0px" cellpadding="0px" cellspacing="50px">
                                <tr>
                                    <td align="left">
                                        <EPiServer:PageTree runat="server" SortOrder="Index" ExpandAll="true" ID="SiteMapTree" PageLink="<%# StartPoint %>">
                                            <HeaderTemplate>
                                            </HeaderTemplate>
                                            <IndentTemplate>
                                               <ul>
                                               
                                            </IndentTemplate>
                                            <ItemHeaderTemplate>
                                                <li>
                                            </ItemHeaderTemplate>
                                            <ItemTemplate>
                                                <EPiServer:Property ID="Property1" PropertyName="PageLink" runat="server" class="sitemap" />
                                            </ItemTemplate>
                                            <ItemFooterTemplate>
                                                </li>
                                            </ItemFooterTemplate>
                                            <UnindentTemplate>
                                                </ul>
                                                 <%# functionTD(Container.DataItem,true) %>
                                            </UnindentTemplate>
                                            <FooterTemplate>
                                            </FooterTemplate>
                                        </EPiServer:PageTree>
                                    </td>
                                </tr>
                            </table>

 

Code behind for the function:

public string functionTD(object e,bool start)
      {
          PageData p = (PageData)e;
          if (p.PageName.Equals("XXPage") && start)
              return "<td align='left' valign='top'><ul>";

        return "<ul>";
      }

 

Not the ideal solution but it worked for me.

Thanks for the help

Diego

#26164
Nov 24, 2008 10:55
error This thread is locked and should be used for reference only. Please use the Episerver CMS 7 and earlier versions forum to open new discussions.
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.