sharepoint中的顶级菜单导航

Question

我没有在sharepoint的所有经验，但已被一个客户要求做他们的sharepoint网站的品牌设计。

我有一个关于顶部导航的问题，它看起来像这样：

Home | Staff | IT | Organization 

包含f.x上的子项。它是这样的

Manuals
Protocols

在下拉菜单中，就像suckerfish

有一个包含三个办公页面的主入口页面

在树状视图中，它将如下所示：

Main
  - Office 1
    - Staff
    - IT
      - Manuals
      - Protocols
    - Organization
  - Office 2
    - Staff
    - IT
      - Manuals
      - Protocols
    - Organization
  - Office 3
    - Staff
    - IT
      - Manuals
      - Protocols
    - Organization

我如何实现这个特定的请求？我是否需要为下拉菜单创建子页面和子页面，或者有其他方法。

Answer 1

假设您希望SharePoint管理导航栏，SharePoint将为您处理导航呈现。有相当多的警告允许SharePoint管理你的导航，如果你打算标记它，主要是在你如何设置你的网站结构。当涉及到品牌时，您将遇到的主要问题是，默认情况下，示例中的大多数主要静态链接(员工、it和组织)实际上将位于导航列表的第二级。

<ul>
    <li><a href=”#”>Home</a>
    <ul>
        <li><a href=”#”>Staff</a></li>
        <li><a href=”#”>IT</a></li>
        <li><a href=”#”> Organization </a></li>
    </ul>
    </li>
</ul>

SharePoint还添加了一堆可能会导致类似SuckerFish问题的div和类。我使用过的大多数导航插件都会尝试隐藏任何非顶层列表项，所以你的导航栏只会显示"Home“，而不会显示其他内容，这并不是很好。

最简单的方法是使用静态导航。使用您自己的导航列表更新您的自定义母版页，为suckerfish应用适当的类，您就可以开始工作了。问题是，您现在必须在每次想要更改导航时更新您的母版页。

下一个选择是使用jquery解析SharePoint对导航的渲染，以一种suckerfish友好的方式重新构建它，最后让suckerfish标记它。我们已经为相当多的客户使用了它，因为它又快又简单。您将所有繁重的任务都交给了客户端，并且根据您构建html、css和js的方式，在更新nav时可能会出现闪烁。

第三，大锤方法，破解css，并使用jquery为您的OOTB SP导航添加类似suckerfish的效果。这并不难，虽然我不觉得这是优雅的。

第四，创建您自己的导航web部件，它将以您喜欢的方式呈现您的站点地图。这需要SharePoint的知识以及如何构建一个可靠的应用程序。我只推荐有SharePoint经验的开发人员使用。

我理解学习如何使用SharePoint的渴望，我们都是从某个人第一次提出品牌SP的请求开始的。问题是，品牌化SharePoint是一种非常不同的技能，而不是建立一个一般的网站，修改Joomla，WordPress等。你可能会发现它更快与公司合作，有经验和知识的品牌SharePoint，以便它是正确的。然后，您可以将此知识用于您的下一个SP请求。

我希望这能帮到你。

Answer 2

首先转到站点设置>>导航(在外观下)根据需要添加/移除“全局导航”下的链接

其次，编辑您的母版页并添加以下内容

    <PublishingNavigation:PortalSiteMapDataSource ID="topSiteMap" runat="server" EnableViewState="false" SiteMapProvider="GlobalNavigation" StartFromCurrentNode="true" StartingNodeOffset="0" ShowStartingNode="false" TrimNonCurrentTypes="Heading"/>



    <SharePoint:AspMenu ID="TopNavigationMenuV1" EncodeTitle="false" Runat="server" EnableViewState="false" DataSourceID="topSiteMap" AccessKey="<%$Resources:wss,navigation_accesskey%>" UseSimpleRendering="true" UseSeparateCss="false" Orientation="Horizontal" StaticDisplayLevels="2" MaximumDynamicDisplayLevels="4" SkipLinkText="">

您可以随心所欲地使用这些属性