EpiServer 9 mvc 将页面添加到导航

Question

我正在玩一个Episerver网站。我不是在使用模板，而只是一个空白的 Episerver 站点。

我以编程方式创建了一个页面类型，例如起始页，我可以将其作为新页面添加到编辑视图中。所以我的问题是如何让我创建的新页面显示在导航栏中？谢谢！

   <div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <!-- Some code here?? -->
            </ul>
        </div>
    </div>
</div>

Answer 1

这就是我在旧项目中解决它的方式：

1. 创建一个名为"帮助程序"的新文件夹

2. 创建新类"导航助手"：

   using EPiServer;
   using EPiServer.Core;
   using EPiServer.Filters;
   using EPiServer.ServiceLocation;
   using EPiServer.Web.Mvc.Html;
   using EPiServer.Web.Routing;
   using System.Linq;
   using System.Web.Mvc;
   namespace Demo.Helpers
   {
       public static class NavigationHelper
       {
       public static void RenderMainNavigation(this HtmlHelper html, PageReference rootLink = null, ContentReference contentLink = null, bool includeRootPage = true, IContentLoader contentLoader = null)
       {
           var writer = html.ViewContext.Writer;
           contentLink = contentLink ?? @html.ViewContext.RequestContext.GetContentLink();
           rootLink = rootLink ?? ContentReference.StartPage;
           if (includeRootPage)
           {
               if (rootLink.CompareToIgnoreWorkID(contentLink))
               {
                   writer.WriteLine("<li class="active">");
               }
               else
               {
                   writer.WriteLine("<li>");
               }
               writer.WriteLine(html.ContentLink(rootLink).ToHtmlString());
               writer.WriteLine("</li>");
           }
           contentLoader = contentLoader ?? ServiceLocator.Current.GetInstance<IContentLoader>();
           var topLevelPages = contentLoader.GetChildren<PageData>(ContentReference.StartPage).ToList();
           topLevelPages = FilterForVisitor.Filter(topLevelPages).OfType<PageData>().Where(x => x.VisibleInMenu).ToList();
           var currentBranch = contentLoader.GetAncestors(contentLink).Select(x => x.ContentLink).ToList();
           currentBranch.Add(contentLink);
           foreach (var topLevelPage in topLevelPages)
           {
               if (currentBranch.Any(x => x.CompareToIgnoreWorkID(topLevelPage.ContentLink)))
               {
                   writer.WriteLine("<li class="active">");
               }
               else
               {
                   writer.WriteLine("<li>");
               }
               writer.WriteLine(html.PageLink(topLevelPage).ToHtmlString());
               writer.WriteLine("</li>");
           }
       }
   }
   }
   

代码有点粗糙，但它有效，并将为您提供有关如何根据您的需求自定义它的一些信息。

3. 在布局页面的顶部，为新类添加使用。例如：

   @using Demo.Helpers;
   

4. 在您的布局中替换""与：

   @{
     Html.RenderMainNavigation();
    }
   

现在，您应该有一个可以自定义项目的工作菜单:)

我在旧网站制作的项目中发现了这个相对简单的代码。代码可能取自Joel Abrahamsson编写的"EPiServer 7 CMS开发"一书。或者它可能来自合金模板，但如果我没记错的话，合金中的代码对于主菜单来说有点复杂。

Answer 2

查看合金模板，当您以前完全没有使用过 Episerver 时，这是最好的入门方法：https://github.com/episerver/AlloyDemoKit