NIUCLOUD是一款SaaS管理后台框架多应用插件+云编译。上千名开发者、服务商正在积极拥抱开发者生态。欢迎开发者们免费入驻。一起助力发展! 广告
[TOC] > [home](https://jingping-ye.github.io/docsify-docs-zh/) > [更多插件](https://docsify.js.org/#/awesome?id=plugins) ## 概述 Docsify 是一个轻量级的文档网站生成器,不会生成静态 html 文件,而是在运行时直接加载并解析 Markdown 文件。 **主要特点** * 🚀 零配置,快速开始 * 📝 智能的全文搜索 * 🎨 多个主题 * 🌐 支持服务端渲染 SSR * 🔌 丰富的插件系统 * 💻兼容 IE11 * 🌍 支持多语言 ## 插件 - 全文搜索 - 谷歌分析 - emoji - 外部脚本 - 放大图片 - 每一页添加 Edit on github 按钮 - 嵌入 jsfiddle - 复制到剪贴板 - Disqus 评论 - 领英 - Gitalk - 翻页插件 - 字数统计 ## 第三方插件 * [docsify-remote-markdown](https://github.com/JerryC8080/docsify-remote-markdown)\- 从远程加载 markdown 文档。[@JerryC](https://github.com/JerryC8080) * [docsify-plantuml](https://github.com/imyelo/docsify-plantuml)\- PlantUML for docsify @imyelo. [docsify-copy-code](https://github.com/jperasmus/docsify-copy-code)\- A docsify plugin that copies Markdown code block to your clipboard[@jperasmus](https://github.com/jperasmus). * [docsify-tabs](https://jhildenbiddle.github.io/docsify-tabs)\- 一个 docsify 插件,用于显示 markdown ([@jhildenbiddle](https://github.com/jhildenbiddle/)) 中的选项卡式内容。 * [docsify-pdf-embed](https://github.com/lazypanda10117/docsify-pdf-embed)\- 用于将 PDF 嵌入任何页面[@lazypanda10117](https://github.com/lazypanda10117)的 docsify 插件。 * [docsify-pdf-converter](https://github.com/meff34/docsify-to-pdf-converter)\- 根据您的 docsify 项目[@meff34](https://github.com/meff34)创建 PDF 文件。 * [docsify-toc](https://github.com/mrpotatoes/docsify-toc)\- 向您的网站添加`目录`。[@mrpotatoes](https://github.com/mrpotatoes)。 * [docsify-changelog-plugin](https://github.com/anikethsaha/docsify-plugin/tree/master/packages/docsify-changelog-plugin)\- 将您的更改日志集成到一个 sweet 面板中。 * [docsify-top-bannner-plugin](https://github.com/anikethsaha/docsify-plugin/tree/master/packages/docsify-top-banner-plugin)\- 在顶部添加一个简单而甜美的横幅,以宣布某事。 * [docsify-dark-mode](https://github.com/anikethsaha/docsify-plugin/tree/master/packages/docsify-dark-mode)\- 在 docsify 站点中添加暗模式支持。 * [docsify-progress](https://github.com/HerbertHe/docsify-progress)\- 一个在 docsify 中呈现阅读进度的插件。@HerbertHe。 * [docsify-charty](https://github.com/markbattistella/docsify-charty)\- 向 docsify 网站添加一些图表和图形。饼图、圆环图、截面图、条形图和柱形图、折线图和绘图以及评论块。如果您需要可视化一些数字,应有尽有! ## 支持的主题 ``` // 未压缩 <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/vue.css"> <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/buble.css"> <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/dark.css"> <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/pure.css"> // 压缩 <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/lib/themes/vue.css"> <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/lib/themes/buble.css"> <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/lib/themes/dark.css"> <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/lib/themes/pure.css"> ``` **第三方主题** * [docsify-darklight-theme](https://github.com/boopathikumar018/docsify-darklight-theme)- 这是一个简单且高度可定制的 docsify.js 主题。使用此主题,文档将具有主题切换器,用于在`深色模式`和`浅色模式`之间切换。在此处查看[预览](https://docsify-darklight-theme.boopathikumar.me/)。[@boopathikumar](https://boopathikumar.me/)。 * [😺 docsify-theme-github](https://github.com/LIGMATV/docsify-theme-github)\- 复制 GitHub Markdown 样式的最小 CSS 量。[预览](https://docsify-theme-github.vercel.app/)~[@LIGMATV](https://github.com/LIGMATV)。 ## 快速入门 ### 初始化 ``` docsify init docs ``` 目录结构 ``` |—— docs |—— index.html 入口 |—— README.md 主页 |—— .nojekyll 防止Github忽视下划线开头文件 ``` 运行 ``` docsify serve /or php -S 127.0.0.1:1234 ``` ### 添加页面 ``` |—— docs |-- REAMD.md |-- 自定义.md |-- 指导文档 |-- READMD.md |-- 部署.md ``` 添加侧边栏 _sidebar.md ``` - [首页](/) - [快速入门](快速入门.md) ``` 配置 ``` <!-- index.html --> <script> window.$docsify = { loadSidebar: true, }; </script> <script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script> ``` 为标签设置标题 -sidebar.md ``` - [首页](/) - [快速入门](快速入门.md "从这里开始") ``` 从这里开始会出现在页面中 ### 顶部导航栏 index.html ``` <script> window.$docsify = { loadNavbar: true, }; </script> ``` _navbar ``` - [百度](https://www.baidu.com) - 经典文档 - [快速入门](/快速入门.md) - [:cn:](/自定义导航栏.md) ``` ### 添加封面 index.html ``` window.$docsify = { coverpage: true, onlyCover: true, // false: 下拉显示文档, true=跳转显示文档 }; ``` _coverpage.md ``` # docsify 中文文档 <small>1.0</small> > 快速文档生成器 - 简单轻量(21kB) - 无需静态构建 - 主题丰富 [GitHub](https://github.com/docsifyjs/docsify/) [快速上手](/快速上手/开始) ``` **自定义背景图片** _coverpage.md ``` <!-- 背景 --> <!--![](_media/bg.png)--> <!-- 背景颜色 --> ![color](#deded) ```