技术解析

仿了一个类似 Gitbook 的 hugo 主题
0
2021-06-02 20:48:36
idczone

前两天在折腾公司的文档系统,找来找去也没找到比较合适的文档平台(有的付费、有的不满意),后来发现好多公司都用 GitBook 来搭建文档。于是我又去研究了下 Gitbook,结果发现这个东西真是年久失修,而且关于 GitBook 抗投诉服务器的好多网页链接都 404 了(指向了 GitBook.com ),我把 GitBook 最后的发布版本弄到本地总算跑起来了,但是我先老是有各种小错误出现,而且主题不知道怎么修改。。。折腾的特别郁闷,主要是我心里在想即使我自己重复造轮子,也就是解析一下 Markdown 渲染一个网页的事情结果搞了一整个下午,于是痛定思痛决定自己山寨一个 GitBook,山寨 GitBook 最核心的还是解析 Markdown 文档,后来我一想 hugo 其实不就是一个现成的 Markdown 解析器吗。。。于是打开 hugo 的官网,找了最接近我需求的主题,改了下 CSS 不到 30 分钟,一个 90%山寨版的 GitBook 主题就诞生了。用 hugo 主题的好处是我可以方面添加我要的、删除我不想要的页面元素。

这个主题我已经传到了 Github 上 : https://github.com/ntop001/hugo-gitbook-theme

大概效果可以看我们公司的文档: http://qingjucrm.com/docs

不过这个主题现在是不支持移动端的(没做适配)。切记,如果使用的话要配置:

[params]
    # Documentation Menu section
    # Menu style settings
    menu_style = "open-menu" # "open-menu" or "slide-menu" or "" blank is as no sidebar

不然左侧的目录会不显示(更多可以参考 example 里面的配置)。


赞一个,正好在收集这种写文档的 themes
顺带附带几个在看的:
https://themes.gohugo.io/theme/hugo-whisper-theme/
https://doks.netlify.app/
https://geekdocs.de/
https://themes.gohugo.io/theme/docuapi//>https://themes.gohugo.io/theme/hugo-theme-learn/en/

你找的这几个都不错,我找的时候竟然都没有看到。。

考虑模仿个新版 Gitbook 主题么
数据地带为您的网站提供全球顶级IDC资源
在线咨询
专属客服