合 gitbook插件整理--book.json文件配置

发布日期 2023年3月24日 · 已更新 2024年9月13日

0 88 2

Tags：整理自网络 gitbook book.json

👉 本文共约20393个字，系统预计阅读时间或需77分钟。

配置概况
1.1. 全局配置
1.2. 插件列表 PLUGINS
1.3. 插件属性配置PLUGINSCONFIG
一些实用插件
2.1. BACK-TO-TOP-BUTTON 回到顶部
2.2. 导航目录折叠
2.2.1. CHAPTER-FOLD 左侧目录折叠
2.2.2. EXPANDABLE-CHAPTERS-SMALL 左侧章节目录可折叠
2.2.3. EXPANDABLE-CHAPTERS 可扩展导航章节
2.3. 代码复制，行号
2.3.1. CODE 代码添加行号&复制按钮（可选）
2.3.2. COPY-CODE-BUTTON 代码块复制按钮
2.4. TODO 待做项☑
2.5. INSERT-LOGO 插入LOGO
2.6. SEARCH-PRO 高级搜索（支持中文）
2.7. ADVANCED-EMOJI 支持EMOJI表情
2.8. GITHUB 在右上角添加GITHUB图标
2.9. EMPHASIZE 为文字加上底色
2.10. SPLITTER 侧边栏宽度可调节
2.11. SHARING-PLUS 分享
2.12. 页脚、版权信息
2.12.1. TBFED-PAGEFOOTER 页面添加页脚（内容少）
2.12.2. PAGE-COPYRIGHT 页面页脚版权（内容多）
2.13. SECTIONX 将页面分块显示
2.14. 生成页内目录
2.14.1. PAGE-TREEVIEW 生成页内目录
2.14.2. SIMPLE-PAGE-TOC 生成本页目录
2.15. 悬浮目录
2.15.1. PAGE-TOC-BUTTON 悬浮目录
2.15.2. ANCRE-NAVIGATION 悬浮目录和回到顶部
2.16. KLIPSE 嵌入类似IDE的功能
2.17. DONATE 打赏插件
2.18. CHANGE_GIRLS 可自动切换的背景
2.19. 警报
2.19.1. ALERTS 警报
2.19. FLEXIBLE-ALERTS 警报
2.20. PAGEVIEW-COUNT 阅读量计数
2.21. AUTO-SCROLL-TABLE 表格滚动条
2.22. 查看图片
2.22.1. POPUP 弹出大图
2.22. LIGHTBOX 单击查看图片
2.23. CLICK-REVEAL 点击显示
2.24. CUSTOM-FAVICON 修改标题栏图标
2.25. ACCORDION 折叠模块
2.26. HIDE-ELEMENT 隐藏元素
multipart
image-captions
主要功能
使用场景
如何使用
示例
优点
注意事项
总结
插件总结
参考

配置概况

1.1. 全局配置

title
设置书本的标题
"title" : "Gitbook Use"
author
作者的相关信息
"author" : "mingyue"
description
本书的简单描述
"description" : "记录Gitbook的配置和一些插件的使用"
language
Gitbook使用的语言, 版本2.6.4中可选的语言如下：
en, ar, bn, cs, de, en, es, fa, fi, fr, he, it, ja, ko, no, pl, pt, ro, ru, sv, uk, vi, zh-hans, zh-tw
例如，配置使用简体中文
"language" : "zh-hans"
links
在左侧导航栏添加链接信息
"links" : { "sidebar" : { "Home" : "https://www.baidu.com" } }
1
2
3
4
5
"links" : {
   "sidebar" : {
       "Home" : "https://www.baidu.com"
   }
}
styles
自定义页面样式，默认情况下各generator对应的css文件
"styles": { "website": "styles/website.css", "ebook": "styles/ebook.css", "pdf": "styles/pdf.css", "mobi": "styles/mobi.css", "epub": "styles/epub.css" }
1
2
3
4
5
6
7
"styles": {
"website": "styles/website.css",
"ebook": "styles/ebook.css",
"pdf": "styles/pdf.css",
"mobi": "styles/mobi.css",
"epub": "styles/epub.css"
}
例如使<h1> <h2>标签有下边框，可以在website.css中设置
h1 , h2{ border-bottom: 1px solid #EFEAEA; }
1
2
3
h1 , h2{
border-bottom: 1px solid #EFEAEA;
}
1.2. 插件列表 PLUGINS
配置使用的插件
"plugins": [ "-search", "back-to-top-button", "expandable-chapters-small", "insert-logo" ]
1
2
3
4
5
6
"plugins": [
"-search",
"back-to-top-button",
"expandable-chapters-small",
"insert-logo"
]
其中"-search"中的 - 符号代表去除默认自带的插件

Gitbook 中默认带有 5 个插件：

名称	说明
`highlight`	语法高亮插件，代码高亮功能
`search`	搜索插件，不支持中文搜索
`sharing`	分享插件，右上角分享功能
`font-settings`	字体设置（最上方的"A"符号）
`livereload`	热加载插件，为 GitBook 编辑进行实时重新预览加载

1.3. 插件属性配置PLUGINSCONFIG

配置插件的属性
例如配置insert-logo的属性：

  "pluginsConfig": {
    "insert-logo": {
      "url": "images/logo.png",
      "style": "background: none; max-height: 30px; min-height: 30px"
    }
  }

"pluginsConfig": {

"insert-logo": {

"url": "images/logo.png",

"style": "background: none; max-height: 30px; min-height: 30px"

}

一些实用插件

记录一些实用的插件
用法：在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-插件名，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

2.1. BACK-TO-TOP-BUTTON 回到顶部

插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-back-to-top-button，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
    "plugins": [
         "back-to-top-button"
    ]
}

{

"plugins": [

"back-to-top-button"

]

}

2.2. 导航目录折叠

2.2.1. CHAPTER-FOLD 左侧目录折叠

支持多层目录，点击导航栏的标题名就可以实现折叠扩展。
插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-chapter-fold，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
    "plugins": ["chapter-fold"]
}

{

"plugins": ["chapter-fold"]

}

2.2.2. EXPANDABLE-CHAPTERS-SMALL 左侧章节目录可折叠

支持多层目录，比Toggle Chapters好用
只有点击箭头才能实现折叠扩展。不如【2.2.1. chapter-fold 左侧目录折叠】好用
插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-expandable-chapters-small，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
    "plugins": [
         "expandable-chapters-small"
    ]
}

{

"plugins": [

"expandable-chapters-small"

]

}

2.2.3. EXPANDABLE-CHAPTERS 可扩展导航章节

和expandable-chapters-small效果相同，唯一不同的是这个插件的箭头粗
插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-expandable-chapters，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
    "plugins": [
         "expandable-chapters"
    ]
}

{

"plugins": [

"expandable-chapters"

]

}

2.3. 代码复制，行号

2.3.1. CODE 代码添加行号&复制按钮（可选）

为代码块添加行号和复制按钮，复制按钮可关闭
单行代码无行号。
插件地址
 GitHub地址
在book.json中添加以下内容，然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-code，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
    "plugins" : [ "code" ]
}

{

"plugins" : [ "code" ]

}

如果想去掉复制按钮，在book.json的插件配置块更新：

{
    "plugins" : [ "code" ],
    "pluginsConfig": {
          "code": {
          "copyButtons": false
      }
    }
}

{

"plugins" : [ "code" ],

"pluginsConfig": {

"code": {

"copyButtons": false

}

2.3.2. COPY-CODE-BUTTON 代码块复制按钮

为代码块添加复制的按钮。
插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-copy-code-button，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
    "plugins": ["copy-code-button"]
}

{

"plugins": ["copy-code-button"]

}

效果如下图所示：

2.4. TODO 待做项☑

添加 Todo 功能。默认的 checkbox 会向右偏移 2em，如果不希望偏移，可以在 website.css 里加上下面的代码:

input[type=checkbox]{
    margin-left: -2em;
}

input[type=checkbox]{

margin-left: -2em;

}

插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-todo，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
"plugins": ["todo"]
}

{

"plugins": ["todo"]

}

使用示例：

*   [ ]  write some articles
*   [x]  drink a cup of tea

1 2	* [ ] write some articles * [x] drink a cup of tea

2.5. INSERT-LOGO 插入LOGO

将logo插入到导航栏上方中
插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-insert-logo，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
  "plugins": [
       "insert-logo"
  ],
  "pluginsConfig": {
    "insert-logo": {
      "url": "images/logo.png",
      "style": "background: none; max-height: 30px; min-height: 30px"
    }
  }
}

{

"plugins": [

"insert-logo"

"pluginsConfig": {

"insert-logo": {

"url": "images/logo.png",

"style": "background: none; max-height: 30px; min-height: 30px"

}

2.6. SEARCH-PRO 高级搜索（支持中文）

支持中文搜索, 在使用此插件之前，需要将默认的search和lunr 插件去掉。
插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-search-pro

{
    "plugins": [
         "-lunr", "-search", "search-pro"
    ]
}

{

"plugins": [

"-lunr", "-search", "search-pro"

]

}

2.7. ADVANCED-EMOJI 支持EMOJI表情

emoij表情列表
 插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-advanced-emoji，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
    "plugins": [
        "advanced-emoji"
    ]
}

{

"plugins": [

"advanced-emoji"

]

}

2.8. GITHUB 在右上角添加GITHUB图标

插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-github，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
    "plugins": [ 
        "github" 
    ],
    "pluginsConfig": {
        "github": {
            "url": "https://github.com/zhangjikai"
        }
    }
}

{

"plugins": [

"github"

"pluginsConfig": {

"github": {

"url": "https://github.com/zhangjikai"

}

效果图：

2.9. EMPHASIZE 为文字加上底色

插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-emphasize，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
    "plugins": [
        "emphasize"
    ]
}

{

"plugins": [

"emphasize"

]

}

然后在markdown / asciidoc内容中，使用以下内容突出显示一些文本：

  This text is {% em %}highlighted !{% endem %}
  This text is {% em %}highlighted with **markdown**!{% endem %}
  This text is {% em type="green" %}highlighted in green!{% endem %}
  This text is {% em type="red" %}highlighted in red!{% endem %}
  This text is {% em color="#ff0000" %}highlighted with a custom color!{% endem %}

This text is {% em %}highlighted !{% endem %}

This text is {% em %}highlighted with **markdown**!{% endem %}

This text is {% em type="green" %}highlighted in green!{% endem %}

This text is {% em type="red" %}highlighted in red!{% endem %}

This text is {% em color="#ff0000" %}highlighted with a custom color!{% endem %}

效果图：

2.10. SPLITTER 侧边栏宽度可调节

插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-splitter，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
    "plugins": [
        "splitter"
    ]
}

{

"plugins": [

"splitter"

]

}

2.11. SHARING-PLUS 分享

分享当前页面，比默认的 sharing 插件多了一些分享方式。
插件地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-sharing-plus

{
    "plugins": ["-sharing", "sharing-plus"],
    "pluginsConfig": {
        "sharing": {
           "douban": false,
           "facebook": false,
           "google": true,
           "hatenaBookmark": false,
           "instapaper": false,
           "line": true,
           "linkedin": true,
           "messenger": false,
           "pocket": false,
           "qq": false,
           "qzone": true,
           "stumbleupon": false,
           "twitter": false,
           "viber": false,
           "vk": false,
           "weibo": true,
           "whatsapp": false,
           "all": [
               "douban", "facebook", "google", "hatenaBookmark", 
               "instapaper", "linkedin","twitter", "weibo", 
               "messenger","qq", "qzone","viber","vk","weibo",
               "pocket", "stumbleupon","whatsapp"
           ]
       }
    }
}

{

"plugins": ["-sharing", "sharing-plus"],

"pluginsConfig": {

"sharing": {

"douban": false,

"facebook": false,

"google": true,

"hatenaBookmark": false,

"instapaper": false,

"line": true,

"linkedin": true,

"messenger": false,

"pocket": false,

"qq": false,

"qzone": true,

"stumbleupon": false,

"twitter": false,

"viber": false,

"vk": false,

"weibo": true,

"whatsapp": false,

"all": [

"douban", "facebook", "google", "hatenaBookmark",

"instapaper", "linkedin","twitter", "weibo",

"messenger","qq", "qzone","viber","vk","weibo",

"pocket", "stumbleupon","whatsapp"

]

}

其中：
为true的代表直接显示在页面顶端，为false的不显示，不写默认为false
"all"中代表点击分享符号显示出来的
支持网站：

  "douban", "facebook", "google", "hatenaBookmark", 
  "instapaper", "linkedin","twitter", "weibo", 
  "messenger","qq", "qzone","viber","vk","weibo",
  "pocket", "stumbleupon","whatsapp"

"douban", "facebook", "google", "hatenaBookmark",

"instapaper", "linkedin","twitter", "weibo",

"messenger","qq", "qzone","viber","vk","weibo",

"pocket", "stumbleupon","whatsapp"

效果图：
如果想增加其他分享网站，可以自己修改插件文件button.js和package.json。

首先你要知道那个网站的分享链接的结构（可以随便找其他的网站点击分享看看URL），比如我增加分享到人人网,链接是这样的结构（红框里的是通用结构，后面内容是不同的。第一部分表示被分享的URL，第二部分是标题title）：
然后在button.js中的var SITES = {····}中添加一条信息，和上面其他分享的信息类似。比如我增加的人人网是这样的

在package.json中仿照前面内容添加新网站的信息。比如我添加的人人网：

  "renren": {
    "default": false,
    "description": "人人网",
    "type": "boolean"
  }

"renren": {

"default": false,

"description": "人人网",

"type": "boolean"

}

2.12. 页脚、版权信息

2.12.1. TBFED-PAGEFOOTER 页面添加页脚（内容少）

插件地址
 GitHub地址
在book.json中添加以下内容。然后执行gitbook install，或者使用NPM安装（单独安装推荐NPM）npm install gitbook-plugin-tbfed-pagefooter，也可以从源码GitHub地址中下载，放到node_modules文件夹里（GitHub地址在进入插件地址右侧的GitHub链接）

{
"plugins": [
   "tbfed-pagefooter"
],
"pluginsConfig": {
    "tbfed-pagefooter": {
        "copyright":"Copyright &copy zhangjikai.com 2017",
        "modify_label": "该文件修订时间：",
        "modify_format": "YYYY-MM-DD HH:mm:ss"
    }
}
}

{

"plugins": [

"tbfed-pagefooter"

"pluginsConfig": {

"tbfed-pagefooter": {

"modify_label": "该文件修订时间：",

"modify_format": "YYYY-MM-DD HH:mm:ss"

}

本人提供Oracle(OCP、OCM)、MySQL(OCP)、PostgreSQL(PGCA、PGCE、PGCM)等数据库的培训和考证业务，私聊QQ646634621或微信dbaup66，谢谢！

后续精彩内容已被站长无情隐藏，请输入验证码解锁本文！

获取验证码：请先关注本站微信公众号，然后回复“验证码”，获取验证码。在微信里搜索“AiDBA”或者“dbaup6”或者微信扫描右侧二维码都可以关注本站微信公众号。

打赏赞(2)

标签：整理自网络 gitbook book.json

小麦苗

学习或考证，均可联系麦老师，请加微信db_bao或QQ646634621

发表回复取消回复

要发表评论，您必须先登录。

1、声明：本网站有部分文章整合或转载自网络，文章著作权归属原作者或原团队；若有侵权，深表歉意，请联系本站站长进行处理，谢谢！！！
2、本站提供数据库的培训和考证业务，培训包含但不限于Oracle、MySQL、PostgreSQL、SQL Server、国产数据库等，考证包括但不限于Oracle OCP、Oracle OCM、MySQL OCP、PGCA、PGCE、PGCM等，私聊QQ646634621或微信dbaup66，非诚勿扰，谢谢！！！
3、麦老师新建了《西安DBA数据架构师》微信群，有志同道合的朋友可以私聊我入群，我们一起聊技术，聊生活，空了可以喝酒约饭。
4、为了方便大家更有针对性的讨论学习数据库，故新建数据库分类群，包括Oracle群、MySQL群、SQL Server群、PG&GP群、国产&信创群。志同道合的朋友可以入群聊技术聊人生，捣乱的勿进，喷子勿进，极端人士勿进，谢谢。

合 gitbook插件整理--book.json文件配置

配置概况

1.1. 全局配置

1.2. 插件列表 PLUGINS

1.3. 插件属性配置PLUGINSCONFIG

一些实用插件

2.1. BACK-TO-TOP-BUTTON 回到顶部

2.2. 导航目录折叠

2.2.1. CHAPTER-FOLD 左侧目录折叠

2.2.2. EXPANDABLE-CHAPTERS-SMALL 左侧章节目录可折叠

2.2.3. EXPANDABLE-CHAPTERS 可扩展导航章节

2.3. 代码复制，行号

2.3.1. CODE 代码添加行号&复制按钮（可选）

2.3.2. COPY-CODE-BUTTON 代码块复制按钮

2.4. TODO 待做项☑

2.5. INSERT-LOGO 插入LOGO

2.6. SEARCH-PRO 高级搜索（支持中文）

2.7. ADVANCED-EMOJI 支持EMOJI表情

2.8. GITHUB 在右上角添加GITHUB图标

2.9. EMPHASIZE 为文字加上底色

2.10. SPLITTER 侧边栏宽度可调节

2.11. SHARING-PLUS 分享

2.12. 页脚、版权信息

2.12.1. TBFED-PAGEFOOTER 页面添加页脚（内容少）

相关文章

您可能还喜欢...

发表回复取消回复

网站公告

网站寄语

本站其它工具

搜索本网站

标签云☁

网站日历

网站归档

网站分类

2024 年 11 月
一	二	三	四	五	六	日
				1	2	3
4	5	6	7	8	9	10
11	12	13	14	15	16	17
18	19	20	21	22	23	24
25	26	27	28	29	30

合 gitbook插件整理--book.json文件配置

配置概况

1.1. 全局配置

1.2. 插件列表 PLUGINS

1.3. 插件属性配置PLUGINSCONFIG

一些实用插件

2.1. BACK-TO-TOP-BUTTON 回到顶部

2.2. 导航目录折叠

2.2.1. CHAPTER-FOLD 左侧目录折叠

2.2.2. EXPANDABLE-CHAPTERS-SMALL 左侧章节目录可折叠

2.2.3. EXPANDABLE-CHAPTERS 可扩展导航章节

2.3. 代码复制，行号

2.3.1. CODE 代码添加行号&复制按钮（可选）

2.3.2. COPY-CODE-BUTTON 代码块复制按钮

2.4. TODO 待做项☑

2.5. INSERT-LOGO 插入LOGO

2.6. SEARCH-PRO 高级搜索（支持中文）

2.7. ADVANCED-EMOJI 支持EMOJI表情

2.8. GITHUB 在右上角添加GITHUB图标

2.9. EMPHASIZE 为文字加上底色

2.10. SPLITTER 侧边栏宽度可调节

2.11. SHARING-PLUS 分享

2.12. 页脚、版权信息

2.12.1. TBFED-PAGEFOOTER 页面添加页脚（内容少）

相关文章

您可能还喜欢...

在GreenPlum中使用PgBouncer连接池

GreenPlum数据迁移工具之gpcopy

Gitbook 静态站点 加入谷歌广告代码

发表回复 取消回复

网站公告

网站寄语

本站其它工具

搜索本网站

标签云☁

网站日历

网站归档

网站分类

Gitbook 静态站点加入谷歌广告代码

发表回复取消回复