Umbraco 7.4.3 下拉导航

Question

我刚开始使用 Umbraco（和 razor/mvc）。到目前为止，我已经成功设置了基本设计，但下一步是导航。

我一直在阅读文档并在线寻找代码片段，但不幸的是 none 确实有帮助（或者我可能理解不正确）。

我现在使用的代码如下所示：

<ul>
        @{
            var homeNode = CurrentPage.AncestorsOrSelf(1).First();

            // The menu items we want are all of the children of the homepage
            // We also check if "Hide in navigation" is on in the menu, we shouldn't show hidden items
            var menuItems = homeNode.Children.Where("UmbracoNaviHide == false");
        }

        <li><a href="@homeNode.Url">@homeNode.Name</a></li>

        @foreach (var page in menuItems)
        {
            if(page.Name!="Banner Settings")
            {
            <li>
                <a href="@page.Url">@page.Name</a>

                    <!-- If the page has child nodes (2nd level) that are visible and docTypeAlias is Textpage (textpages) -->
                @if (page.Textpages.Where("UmbracoNaviHide == false").Count() > 0)
                {
                    <ul>
                        @foreach (var childPage in page.Children.Where("UmbracoNaviHide == false"))
                        {
                            <li><a href="@childPage.Url">@childPage.Name</a></li>
                        }
                    </ul>
                }
            </li>
            }
        }
    </ul>

取自How to create Top navigation Sub Menu in umbraco CMS using partial view.

但不幸的是，正如代码本身指出的那样，它只显示我所在的当前页面及其子页面。

有没有办法显示所有菜单项，包括它们的子项而不是当前的？我似乎无法弄清楚。

Answer 1

您实际上会在 Umbraco 中找到有关如何实现导航的示例模板实现。下面是一个直接来自 Umbraco v7.4.3

的例子

@inherits Umbraco.Web.Macros.PartialViewMacroPage

@*
    This snippet displays a list of links of the pages immediately under the top-most page in the content tree.
    This is the home page for a standard website.
    It also highlights the current active page/section in the navigation with the css class "current".
*@

@{ var selection = CurrentPage.Site().Children.Where("Visible"); }

<ul>
    @foreach (var item in selection)
    {
        <li class="@(item.IsAncestorOrSelf(CurrentPage) ? "current" : null)">
            <a href="@item.Url">@item.Name</a>
        </li>
    }
</ul>

这将为您提供顶级菜单，但您想要的是递归呈现所有子项，因此站点地图示例将使您更好地了解如何实现这一点。下面的例子再次取自 Umbraco v7.4.3.

@inherits Umbraco.Web.Macros.PartialViewMacroPage

@*
    This snippet makes a list of links of all visible pages of the site, as nested unordered html lists.

    How it works:
    - It uses a custom Razor helper called Traverse() to select and display the markup and links.
*@

@{ var selection = CurrentPage.Site(); }

<div class="sitemap">
    @* Render the sitemap by passing the root node to the traverse helper, below *@
    @Traverse(selection)
</div>


@* Helper method to travers through all descendants *@
@helper Traverse(dynamic node)
{
    @* Update the level to reflect how deep you want the sitemap to go *@
    var maxLevelForSitemap = 4;

    @* Select visible children *@
    var selection = node.Children.Where("Visible").Where("Level <= " + maxLevelForSitemap);

    @* If any items are returned, render a list *@
    if (selection.Any())
    {
        <ul>
            @foreach (var item in selection)
            {
                <li class="level-@item.Level">
                    <a href="@item.Url">@item.Name</a>

                    @* Run the traverse helper again for any child pages *@
                    @Traverse(item)
                </li>
            }
        </ul>
    }
}

模板在空白安装中。您无需安装入门工具包即可访问它们。在开发人员部分，转到“部分视图宏”并单击“创建”，然后您将看到模板选项。

Umbraco 7.4.3 下拉导航

Umbraco 7.4.3 dropdown navigation

model-view-controller

umbraco

razor