Blogger Code Highlighting 代码高亮
在决定使用Blogger后,第一件事就是琢磨怎么实现代码高亮。于是顺着三篇教程,分别尝试了用 Syntax Highlighter, 然后用 Google drive 和 github pages 做host,非常麻烦而且代码高亮都无法使用。
最后看到了一个用 google-code-prettify 的教程,发现了代码高亮的实现原来可以如此简洁简单。
1. 进入http的编辑画面

2. 搜索 </head>, 然后在之前加入下列代码, 然后保存:
3. 保存后,在blog里面,切换到HTML编辑模式,然后使用pre tag 就可以实现代码高亮。
4. 更多的效果和自动化定制,可以参考https://github.com/google/code-prettify。
最后看到了一个用 google-code-prettify 的教程,发现了代码高亮的实现原来可以如此简洁简单。
1. 进入http的编辑画面

2. 搜索 </head>, 然后在之前加入下列代码, 然后保存:
<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>
3. 保存后,在blog里面,切换到HTML编辑模式,然后使用pre tag 就可以实现代码高亮。
<pre class="prettyprint lang-<your language>">
// Your code
</pre>
For example:
<pre class="prettyprint lang-js">
var foo = "Hello World!"
</pre>
下面就是出来的效果var foo = "Hello World!"
4. 更多的效果和自动化定制,可以参考https://github.com/google/code-prettify。
来源:http://ffcc626.blogspot.com/2018/04/blogger-code-highlighting.html
没有评论:
感谢每一条善意的建言和理性的讨论!
特殊时期开启审核制度敬请谅解。
挑衅和引战会被删除并永久拉黑。