Ghost本地安装highlight.js使代码高亮
来源:互联网 发布:数据库自然语言接口 编辑:程序博客网 时间:2024/06/06 12:46
对于程序员写博客来说,这代码高亮是起码的要求。但是Ghost本身没有支持高亮代码。但是可以通过扩展来实现,它就是highlight.js——附官方网站,看了下首页介绍,真的很强大,现在说说怎么进行安装,很简单。
下载highlight.js
下载地址
本来已经包含了很多支持的高亮语言,如果上面没找到你要的语言,可以在下面继续 勾选,最后点击下方的下载。
解压安装highlight.js
解压highlight.js到Ghost本地的主题文件夹下面的资源文件夹,我这里是:
安装highlight.js
用文本编辑器打开theme文件夹下的default.hbs文件进行编辑:
找到{{! Styles’n’Scripts }},在下面添加:
<link rel="stylesheet" type="text/css" href="{{asset "/highlight/styles/hybrid.css"}}" />
这里的hybrid.css是你想用的代码主题,这里我用的hybrid.css,,个人喜好。还可以选择styles文件夹下的其他主题样式。你可以到这个网站预览各种风格的代码主题,选择自己喜欢的。
找到{{! The main JavaScript file for Casper }},在下面添加:
<script type="text/javascript" src="{{asset "/highlight/highlight.pack.js"}}"></script> <script type="text/javascript">hljs.initHighlightingOnLoad();</script>
如何使用代码高亮
用Ghost自带的markdown编辑器时,按照如下格式:
<pre><code class="python">...</code></pre>
python可以换成其它的语言。
Ok!现在可以体验代码高亮的感觉了!效果如下,这是一段python代码:
1 0
- Ghost本地安装highlight.js使代码高亮
- 在Ghost博客 中使用 highlight.js 实现 代码高亮
- 代码语法高亮插件highlight.js
- 代码高亮显示库-highlight.js
- jquery-highlight.js高亮显示
- 代码文本Highlight - 高亮插件
- GNU Source-highlight 语法高亮代码
- markdown-it+highlight.js后端渲染的代码高亮问题解决
- LaTeX下代码高亮(关键字,CTeX, WinEdt, minted, highlight)
- WordPress 代码高亮插件 WP-GeSHi-Highlight
- 给大家推荐一款高大上的代码高亮插件(sublime,github风格)——highlight.js
- Scriptaculous初试----Highlight(高亮)
- solr 高亮处理 (highlight)
- sublime插件Syntax Highlight:使vue高亮,效果不错
- 高亮显示搜索到的关键字-jquery.highlight.js的用法!
- FCKeditor基于SyntaxHighlighter 的代码语法高亮插件(Code Syntax Highlight Plugin for FCKeditor)
- 如何设置SOLR的高亮 (highlight)?
- jquery插件highlight高亮显示
- Android用平铺方式实现锯齿类布局
- QTabWidget 双击 关闭tab标签
- Node.js 学习笔记
- 关于css三角形的制作
- 使用BPEL创建Web服务组合
- Ghost本地安装highlight.js使代码高亮
- 使用GDataXmlNode步骤
- 从LayoutInflater分析XML布局解析成View的树形结构的过程
- 读书笔记《Effective C++》tt
- 多线程图片浏览器
- ddd
- 我哪里有做错了,你能告诉我?
- 实训猜猜看进度2
- html 常用标签