C1SiteMap Features > Customize Layout |
SiteMap allows you to add layouts to different node levels. There are two kinds of layouts:
This topic demonstrates how to change the layout of Level0 and Level1 nodes.
Complete the following steps to change the layout of Level0 ( Default Level ) in Design View.
Complete the following steps to change the layout of Level1 in Design View.
The level for which the layout has been set to Flow will be the last level of the site map. |
Add the following markup within the <cc1:C1SiteMap></cc1:C1SiteMap>
tags, to change the layout of Level0 ( Default Level ) in Source View.
Markup |
Copy Code
|
---|---|
<DefaultLevelSetting SeparatorText="||" Level="0" Layout="List"> <ListLayout RepeatColumns="2" /> </DefaultLevelSetting> |
Add the following markup within the <cc1:C1SiteMap></cc1:C1SiteMap>
tags, to change the layout of Level1 in Source View.
Markup |
Copy Code
|
---|---|
<LevelSettings> <cc1:C1SiteMapLevelSetting Layout="Flow" Level="1" SeparatorText=","> </cc1:C1SiteMapLevelSetting> </LevelSettings> |
Add the following code to the Page_Load event, to change the layout of the Default Level in code.
To write code in C#
C1SiteMap1.DefaultLevelSetting.SeparatorText = ",";
C1SiteMap1.DefaultLevelSetting.Level = 0;
C1SiteMap1.DefaultLevelSetting.Layout = C1.Web.Wijmo.Controls.C1SiteMap.SiteMapLayoutType.List;
C1SiteMap1.DefaultLevelSetting.ListLayout.RepeatColumns = 2;
To write code in VB
C1SiteMap1.DefaultLevelSetting.SeparatorText = ","
C1SiteMap1.DefaultLevelSetting.Level = 0
C1SiteMap1.DefaultLevelSetting.Layout = C1.Web.Wijmo.Controls.C1SiteMap.SiteMapLayoutType.List
C1SiteMap1.DefaultLevelSetting.ListLayout.RepeatColumns = 2
Add the following code to the Page_Load event, to change the layout of Level1 in code.
To write code in C#
// Add a new LevelSetting C1SiteMap1.LevelSettings.Add(new C1.Web.Wijmo.Controls.C1SiteMap.C1SiteMapLevelSetting()); // Customize LevelSetting C1SiteMap1.LevelSettings[0].Level = 1; C1SiteMap1.LevelSettings[0].Layout = C1.Web.Wijmo.Controls.C1SiteMap.SiteMapLayoutType.Flow; C1SiteMap1.LevelSettings[0].SeparatorText = ",";
To write code in VB
' Add a new LevelSetting C1SiteMap1.LevelSettings.Add(New C1.Web.Wijmo.Controls.C1SiteMap.C1SiteMapLevelSetting()) ' Customize LevelSetting C1SiteMap1.LevelSettings(0).Level = 1 C1SiteMap1.LevelSettings(0).Layout = C1.Web.Wijmo.Controls.C1SiteMap.SiteMapLayoutType.Flow C1SiteMap1.LevelSettings(0).SeparatorText = ","
When you run the project, notice that the nodes at Level0 appear as a List, in two columns, whereas the nodes at Level1 appear in a Single Line (Flow), separated by a comma ' , ', as shown in the image below.