docsify/docs/plugins.md

143 lines
3.8 KiB
Markdown
Raw Normal View History

2017-02-22 21:29:26 +08:00
# List of Plugins
2017-02-13 22:43:58 +08:00
2017-02-22 21:29:26 +08:00
## Full text search
2017-02-13 22:43:58 +08:00
By default, the hyperlink on the current page is recognized and the content is saved in `localStorage`. You can also specify the path to the files.
```html
<script>
window.$docsify = {
search: 'auto', // default
search : [
'/', // => /README.md
'/guide', // => /guide.md
'/get-started', // => /get-started.md
'/zh-cn/', // => /zh-cn/README.md
],
2017-03-10 05:19:07 +08:00
// complete configuration parameters
2017-02-13 22:43:58 +08:00
search: {
maxAge: 86400000, // Expiration time, the default one day
paths: [], // or 'auto'
2017-02-19 11:22:34 +08:00
placeholder: 'Type to search',
// Localization
placeholder: {
'/zh-cn/': '搜索',
'/': 'Type to search'
},
noData: 'No Results!',
// Localization
noData: {
'/zh-cn/': '找不到结果',
'/': 'No Results'
},
// Headline depth, 1 - 6
depth: 2
2017-02-13 22:43:58 +08:00
}
}
</script>
2017-03-10 05:19:07 +08:00
<script src="//unpkg.com/docsify/lib/docsify.min.js"></script>
<script src="//unpkg.com/docsify/lib/plugins/search.min.js"></script>
2017-02-13 22:43:58 +08:00
```
2017-02-22 21:29:26 +08:00
## Google Analytics
2017-02-13 22:43:58 +08:00
Install the plugin and configure the track id.
```html
<script>
window.$docsify = {
ga: 'UA-XXXXX-Y'
}
</script>
2017-03-10 05:19:07 +08:00
<script src="//unpkg.com/docsify/lib/docsify.min.js"></script>
<script src="//unpkg.com/docsify/lib/plugins/ga.min.js"></script>
2017-02-13 22:43:58 +08:00
```
Configure by `data-ga`.
2017-03-10 05:19:07 +08:00
```html
<script src="//unpkg.com/docsify/lib/docsify.min.js" data-ga="UA-XXXXX-Y"></script>
<script src="//unpkg.com/docsify/lib/plugins/ga.min.js"></script>
```
## front matter
2017-02-13 22:43:58 +08:00
```html
2017-03-10 05:19:07 +08:00
<script src="//unpkg.com/docsify/lib/plugins/front-matter.min.js"></script>
2017-02-13 22:43:58 +08:00
```
2017-02-22 21:29:26 +08:00
## emoji
2017-02-13 22:43:58 +08:00
2017-02-22 21:29:26 +08:00
The default is to support parsing emoji. For example `:100:` will be parsed to :100:. But it is not precise because there is no matching non-emoji string. If you need to correctly parse the emoji string, you need install this plugin.
2017-02-13 22:43:58 +08:00
2017-02-22 21:29:26 +08:00
```html
2017-03-10 05:19:07 +08:00
<script src="//unpkg.com/docsify/lib/plugins/emoji.min.js"></script>
2017-02-13 22:43:58 +08:00
```
2017-03-06 23:57:28 +08:00
## External Script
If the script on the page is an external one (imports a js file via `src` attribute), you'll need this plugin to make it work.
```html
2017-03-10 05:19:07 +08:00
<script src="//unpkg.com/docsify/lib/plugins/external-script.min.js"></script>
2017-03-06 23:57:28 +08:00
```
2017-03-09 20:26:33 +08:00
## Zoom image
Medium's Image Zoom. Based on [zoom-image](https://github.com/egoist/zoom-image).
```html
2017-03-10 05:19:07 +08:00
<script src="//unpkg.com/docsify/lib/plugins/zoom-image.min.js"></script>
2017-03-09 20:26:33 +08:00
```
## Edit on github
Add `Edit on github` button on every pages. provided by 3rd party, check [document](https://github.com/njleonzhang/docsify-edit-on-github)
## Demo code with instant preview and jsfiddle integration
With this plugin, sample code can be rendered on the page instantly, so that the readers can see the preview immediately.
When readers expand the demo box, the source code and description are shown there. if they click the button `Try in Jsfiddle`,
`jsfiddle.net` will be open with the code of this sample, which allow readers to revise the code and try on their own.
[Vue](https://njleonzhang.github.io/docsify-demo-box-vue/) and [React](https://njleonzhang.github.io/docsify-demo-box-react/) are both supported.
2017-09-20 09:01:06 +08:00
## CodeSponsor
See https://codesponsor.io
```html
<script>
window.$docsify = {
codesponsor: 'id'
}
</script>
<script src="//unpkg.com/docsify/lib/plugins/codesponsor.min.js"></script>
```
## Copy to Clipboard
Add a simple `Click to copy` button to all preformatted code blocks to effortlessly allow users to copy example code from your docs.
```html
<link rel="stylesheet" href="//unpkg.com/docsify-copy-code/styles.css">
<script src="//unpkg.com/docsify-copy-code/index.js"></script>
```
```javascript
window.$docsify = {
plugins: [
window.DocsifyCopyCodePlugin.init()
]
}
```
See [here](https://github.com/jperasmus/docsify-copy-code/blob/master/README.md) for more details.