具有顶部导航和左侧导航的自定义母版页

Question

我已成功将 HTML 页面转换为 SharePoint 2013 母版页。我还创建了自定义页面布局。使用它们，我创建了包含 30 多个页面的 SharePoint 站点。每个页面都包含 Top Header 导航，因为它继承自我使用的母版页。现在我还需要从母版页继承左侧导航。它为我提供了从母版页更新它并通过整个 SharePoint 站点影响它的优势。

但目前我使用 Web 部件作为每个页面的 HTMl 代码片段单独插入左导航。如果需要修改，我必须浏览所有页面并进行修改。这也不方便。我想要这个左侧导航，就像 SharePoint 当前导航替代方案一样，但在我的页面布局中。

是否有在这些论坛中聊天的选项？

有人可以帮我解决这个问题吗？

感谢和问候，

奇兰萨卡

Answer 1

这是我认为您正在尝试做的事情的示例：

http://info.scdot.org/StructuralDesign/SitePages/BridgeDrawingsDetails.aspx

这是一个带有 HTML 页眉、页脚和左侧手风琴导航的共享点页面。我没有使用单独的 "Page Layout" 作为 SP 术语。它在 SP 2010 中。

我在母版页中添加了一个DIV来放置左侧手风琴导航，并将其定位为CSS。

HTML 片段：

<div id="AccordionContainer">
            <div id="Accordion1" class="Accordion">
<h3 class="accordionShow"><a>CADD Design</a></h3>
<div class="insideAccordionPanelContent">
    <!-- First link is for site Map Only and should not appear in Accordion -->
    <a href="http://www.scdot.org/doing/cadd.aspx" class="siteMapShow panelTitle">CADD Design</a>
    <!-- Accordion Links -->
    <p><a href="http://www.scdot.org/doing/cadd_DesignFiles.aspx">CADD Design Files</a></p>
    <p><a href="http://www.scdot.org/doing/cadd_SUE.aspx">Subsurface Utility Engineering (SUE)</a></p>
    <p><a href="http://www.scdot.org/doing/cadd_RoadwayDesign.aspx">Roadway Design Files</a></p>
    <p><a href="http://www.scdot.org/doing/cadd_BridgeDesign.aspx">Bridge Design Files</a></p>
    <p><a href="http://www.scdot.org/doing/cadd_Traffic.aspx">Traffic Engineering Files</a></p>
</div>
<h3 class="accordionShow"><a>Engineering Directives</a></h3>
<div class="insideAccordionPanelContent">
    <!-- First link is for site Map Only and should not appear in Accordion -->
    <a href="http://info.scdot.org/Construction_D/sitepages/Engineering_directives.aspx" class="siteMapShow panelTitle">Engineering Directives</a>
    <!-- Accordion Links -->
    <p><a href="http://info.scdot.org/Construction_D/sitepages/Engineering_directives.aspx">Engineering Directives</a></p>
    <p><a href="http://info.scdot.org/Construction_D/ED/ED-index.pdf">Engineering Directives Index (PDF)</a></p>
</div>
<h3 class="accordionShow"><a>Hydraulic Engineering</a></h3>

如果您使用开发人员工具 (F12) 或 Firebug 检查我的页面，也许会有帮助。希望对您有所帮助！

D

具有顶部导航和左侧导航的自定义母版页

Custom Master Page with Top Navigation and Left Navigation

html

javascript

sharepoint

jquery