Sharepoint 2013 - 将套件栏添加到自定义构建的页面答案

【问题标题】：Sharepoint 2013 - adding the suitebar to a custom built pageSharepoint 2013 - 将套件栏添加到自定义构建的页面
【发布时间】：2015-09-29 16:36:22
【问题描述】：

我在 Sharepoint 2013 中创建了一个完全自定义的主页，它运行良好（使用自定义 HTML、CSS、JS 和 Jquery Lib）。我只需要知道如何将 Sharepoint Suitebar 添加到自定义页面的顶部。

我没有使用任何类型的 Sharepoint 模板或母版页模板。我像其他网页一样构建我的页面，并将我的文件上传到 Sharepoint 中的一个目录，然后将我的自定义页面上传到 Site Pages 目录并将其设置为 home.aspx，这会自动使其成为我的主页。像这样构建一个完全自定义的页面很棒，但是我失去了一些我想使用的 Sharepoint 提供的内置功能和组件，Suitebar 就是其中之一。

我在此处的示例 HTML 模板并不代表我实际的自定义主页。我只是链接这个 JSfiddle，希望有人能告诉我如何/在哪里添加 Sharepoint Suitbar。

JSFiddle： https://jsfiddle.net/x1vcdeLx/

<!DOCTYPE html>
<html>
<head>
<title>Sharepoint Custom Homepage</title>

<!-- Stylesheets -->
<link href="/sites/SiteAssets/css/reset.css">
<link href="/sites/SiteAssets/css/style.css">

</head>
<body>

<!-- BEGIN CREATIVE CONTENT -->
<div class="myContent">
    <div class="row-1-of-3"></div>
    <div class="row-2-of-3"></div>
    <div class="row-3-of-3"></div>
</div>
<!-- END CREATIVE CONTENT -->

<!-- Scripts -->
<script src="/sites/SiteAssets/js/jquery-2.1.4.min.js"></script>
<script src="/sites/SiteAssets/js/jquery-easing-1.3.min.js"></script>
<script src="/sites/SiteAssets/js/script.js"></script>

</body>
</html>

【问题讨论】：

标签： sharepoint-2013

【解决方案1】：

您可以下载 Sharepoint 母版页，然后搜索用于该套件栏的控件。将这些控件放在您的页面中，它可能会正常显示。

要获取套件栏部分的名称，请参见下图

【讨论】：

我确实下载了一个通用的 Sharepoint 母版页模板，然后从 HTML 中获取了套件栏/导航栏，但是一旦我尝试添加这些部分，它就破坏了我的自定义构建页面。有 Sharepoint 特定代码Header 和 Doc Type 中的 HTML，我不知道需要什么，不需要什么。