介绍

手动初始化

如果不喜欢 npm 或者觉得安装工具太麻烦,我们可以直接手动创建一个 index.html 文件。

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <meta charset="UTF-8">
  <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/vue.css">
</head>
<body>
  <div id="app"></div>
  <script>
    window.$docsify = {
      //...
    }
  </script>
  <script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script>
</body>
</html>

如果你的系统里安装了 Python 的话,也可以很容易地启动一个静态服务器去预览你的网站。

cd docs && python -m SimpleHTTPServer 3000
cd docs && python -m http.server 3000

自定义侧边栏

嵌套的侧边栏

你可能想要浏览到一个目录时,只显示这个目录自己的侧边栏,这可以通过在每个文件夹中添加一个 _sidebar.md 文件来实现。

_sidebar.md 的加载逻辑是从每层目录下获取文件,如果当前目录不存在该文件则回退到上一级目录。例如当前路径为 /zh-cn/more-pages 则从 /zh-cn/_sidebar.md 获取文件,如果不存在则从 /_sidebar.md 获取。

当然你也可以配置 alias 避免不必要的回退过程。

<script>
  window.$docsify = {
    loadSidebar: true,
    alias: {
      '/.*/_sidebar.md': '/_sidebar.md'
    }
  }
</script>

自定义导航栏

嵌套

如果导航内容过多,可以写成嵌套的列表,会被渲染成下拉列表的形式。

<!-- _navbar.md -->
 
* 入门
 
  * [快速开始](zh-cn/quickstart.md)
  * [多页文档](zh-cn/more-pages.md)
  * [定制导航栏](zh-cn/custom-navbar.md)
  * [封面](zh-cn/cover.md)
 
 
* 配置
  * [配置项](zh-cn/configuration.md)
  * [主题](zh-cn/themes.md)
  * [使用插件](zh-cn/plugins.md)
  * [Markdown 配置](zh-cn/markdown.md)
  * [代码高亮](zh-cn/language-highlight.md)

HTML

如果你需要定制导航栏,可以用 HTML 创建一个导航栏。

注意:文档的链接都要以 #/ 开头。

<!-- index.html -->
 
<body>
  <nav>
    <a href="#/">EN</a>
    <a href="#/zh-cn/">中文</a>
  </nav>
  <div id="app"></div>
</body>

常见问题

.nojekyll 用于阻止 GitHub Pages 忽略掉下划线开头的文件。

扩展阅读