Blogger自带编辑器中不包含代码高亮功能,这是个弊端,wordpress通过一些插件可以做到,blogger好像并没有插件功能(但可以安装第三方的小工具、挂件),我于是Google一下,看看可不可以通过代码实现。
参考了diannaoxiaobai的文章,
可以连接第三方(google-code-prettify),通过远程调用实现。
不如干脆翻译翻译README,顺便学习一下。
1.进入HTML编辑界面,
添加一行代码
<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>调用prettify。
这行代码可以进行自定义,官方甩出了下面的表格。
CGI parameter | default | meaning |
---|---|---|
autoload=(true, false) | true | run automatically on page load |
lang=... | none | Loads the language handler for the given language which is usually the file extension for source files for that language. See the index of language handlers. If specified multiple times (?lang=css&lang=ml ) then all are loaded. |
skin=... | none | See the skin gallery. If specified multiple times, the first one to successfully load is used. |
callback=js_ident | window.exports["js_ident"] will be called when prettyprinting finishes. If specified multiple times, all are called. |
<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?lang=js&skin=desert"></script>表明使用javascript,代码框的皮肤是Desert,其中皮肤可以在开发者提供的网址中浏览。
使用<pre class="prettyprint">...</pre>
即可使代码高亮,效果如下。class Voila { public: // Voila static const string VOILA = "Voila"; // will not interfere with embedded tags. }同时有效地精简了html的长度。
另外注意,如果在“撰写”模式下继续书写,文字也会被视为代码,要从HTML模式中进行更改!
如果博文中含有不同语言的代码,可以按照如下格式书写代码。
<pre class="prettyprint lang-html"> The lang-* class specifies the language file extensions. File extensions supported by default include "bsh", "c", "cc", "cpp", "cs", "csh", "cyc", "cv", "htm", "html", "java", "js", "m", "mxml", "perl", "pl", "pm", "py", "rb", "sh", "xhtml", "xml", "xsl". </pre>在lang- 后输入语言(按照上述形式),最初的那行html代码是不是要删除lang属性?
大概就是这样,现在我去对上一篇博文做修改。
没有评论:
发表评论