原文链接：http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/umbraco7the-navigation-menu-and-a-parent-page-with-in-finite-children/

Master Template - The Navigation Menu

现在让我们开始解决导航菜单-这里有两个方法，你可以动态创建一个导航菜单的页面内容树中，这样当一个编译器创建了一个页面会自动出现，或者可以更简单的写硬编码。现在我们准备写硬编码（当你开始建立一个网站编写硬编码，你可以移动替换这个，这是一个好的办法）我们之后会让给你之后作为练习。编辑你的Master template编写<nav>标签:

<nav>

    <ul>

        <li><a href="/">Home</a></li>

        <li><a href="/contact-us">Contact Us</a></li>

        <li><a href="/articles">Articles</a></li>

    </ul>

</nav>

保存你的更改，然后测试我们的菜单。你将会发现点击文章链接抛出Umbraco错误说我们没有创建这个页面。现在我们开始创建这些页面。

Articles Parent and Article Items - A Parent Page with Infinite Children

拥有一个父页面的文章和一些有关子文章的编译器可以*添加一些很好例子页面。假设我们虚构的公司，小部件有限公司，一个月写十篇文章，希望文章页面就像一个博客（例如：只用这个功能你可以为你的博客添加一个新闻和事件页面）。

创建新的文档类型“Article Main”和“Article Item”。Document Types Settings > Document Types (hover) > ... > + Create。记得Master Document Type = "none.."

创建以下的Tabs和数据类型：

Articles Main

Tab = Intro

"Articles Title" - Type = Textstring

"Articles Body Text" - type = Rich Text Editor**

【图38】Article Main的文档类型和数据类型

Articles Item

Tab = Contents

"Article Title" - Type = Textstring

"Article Contents" - type = Rich Text Editor**

【图39】Article Item的文档类型和数据类型

现在到Settings > Document Types >Articles Main node > Structure tab > Allowed child nodetypes ，然后选择Article Item。这会允许我们在该目录下创建它的Item（它作为父容器）。当然我们还需要在Acticle Main的节点下创建Homepage node（Settings > Document Types > Homepage node > Structure tab > Allowed child nodetypes --不要选择Article Item 仅仅在主节点水平就可以）。

现在到Content > Homepage node (hover)> ... 创建一个新的节点是Articles Main类型的“Articles”（如果你发现没有这个选项，你需要返回检查你是否允许子节点--你忘记了点击保存）。给这篇文章节点添加一些内容和标题，然后创建几条内容节点在这个节点上（Content > Homepage node > Articles node (hover) > ...）。

现在你应该有一个内容树看起来类似下图（很明显这里显示的都是自己页面节点的名字）。接着让我们去更新我们刚刚创建的模板（当我们创建文档类型时会自动更新）。第一次更新他用Master作为主节点Settings > Templates > Articles Main node > Properties tab > Master template dropdown = "Master"  -记得做类似Articles Item的事情，点击保存Save。

【图40】文章内容树节点

复制简单的内容页面模板，粘贴到每一个新建的模板中（记得点击保存）。然后替换页面字段相关的例句，比如：articlesTitle 和 articlesBodyText 替换为Articles Main 和 articleTitle ；articleContents 替换为Article Item。

如果我们现在去浏览器中检查我们的文章主页面，我们应该可以看到内容了。现在我们需要列出页面下的子节点，这样我们就可以看到我们的文章列表。Umbraco使这项任务变得很简单，但是我们需要使用Razor语言。

从左侧的菜单上选择Developer菜单，悬浮在Partial View Macros Files node 来获得更多的菜单...点击+ Create 。名称为“listArticles”，接着在Choose a snippet片段中选择“List Child Pages Ordered By Date”后点击Create。

【图41 模板父级文章和宏代码】

现在我们要做的就是连接文章主页列出我们的子文章。编辑主文章节点模板Settings > Templates node > Master node > Articles Main node > Template tab. 根据段落标签输入回车后点击Insert Macro按钮，然后点击保存按钮。

现在来检查我们的文章页面--编辑刚才创建的部分（宏）-Developer > Partial View Macro Files > listArticles.cshtml ，改变其内容为：

@inherits Umbraco.Web.Macros.PartialViewMacroPage

@* OrderBy() takes the property to sort by and optionally order desc/asc *@

@foreach (var page in CurrentPage.Children.Where("Visible").OrderBy("CreateDate desc"))

{

    <div class="article">

        <div class="articletitle"><a href="@page.Url">@page.Name</a></div>

        <div class="articlepreview">@Umbraco.Truncate(@page.ArticleContents,100) <a href="@page.Url">Read More..</a></div>

    </div>

    <hr/>

}

现在去浏览器看一下我们的页面。