Sunday, April 3, 2022

在Google blogger中显示程序代码块

 我是用这个插件https://github.com/googlearchive/code-prettify来显示代码块的。

采用的方法如下:

1. 进入blogger后台的Layout选项。

2. 点击Add a Gadget。

3. 选择HTML/JaveScript选项。

4. 加入code-prettify的代码。

<script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js"></script>

5. 编辑博客的时候,切换到HTML模式,用一下方式添加代码。

<pre class="prettyprint">source code here</pre>
<code class="prettyprint">source code here</code>

6. 代码样式可以到Clolor Themes for Google Code Prettify选择一个喜欢的主题,点选CSS复制到刚才的HTML/JavaScript小工具中,粘粘到script的上方,并用<style></style>标签包起来。 

 

Reference:

http://peggyloveslearning.blogspot.com/2017/04/google-blogger.html 

https://jmblog.github.io/color-themes-for-google-code-prettify/

https://demo.smarttutorials.net/html-xml-adsense-parser/ 

https://github.com/googlearchive/code-prettify

No comments:

Post a Comment