如果想要在Blogger中寫幾行程式碼,而且能夠按照變數名稱等等的自動換顏色的話,要怎麼做呢?
上網搜尋了一下之後發現一篇最簡單又實用的說明,說明步驟如下:
1.進入自己的網誌後,可以在左邊點選版面配置
2.點選新增小工具
3.點選 HTML/JavaScript
4.在以下畫面複製貼上以下程式碼,按儲存(標題可以不用填)
6.如果程式碼內,有<>的符號時,如:new list<>,請先到點我網站,將程式碼轉成HTML編碼,先在上面的方框輸入原始程式碼,按下Encode,就可以把Encode出來的程式碼拿來進行下一個步驟。
7.接下來就只要再新增文章的時候切換到HTML
8.可以先在撰寫畫面找到自己要的位置並隨便輸入幾個字,就可以在HTML編輯模式找到適當位置,並將轉好HTML編碼的程式碼以及包圍語法放在適當的位置就可以了。
上網搜尋了一下之後發現一篇最簡單又實用的說明,說明步驟如下:
1.進入自己的網誌後,可以在左邊點選版面配置
![]() |
| 點選版面配置 |
![]() |
| 點選新增小工具 |
![]() |
| 點選 HTML/JavaScript |
![]() |
| 填寫完按儲存 |
<style>
.post .codeblock {
display: block; /* fixes a strange ie margin bug */
font-family: Courier New;
font-size: 10pt;
overflow:auto;
background: #f0f0f0 url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAASwCAYAAAAt7rCDAAAABHNCSVQICAgIfAhkiAAAAQJJREFUeJzt0kEKhDAMBdA4zFmbM+W0upqFOhXrDILwsimFR5pfMrXW5jhZr7PwRlxVX8//jNHrGhExjXzdu9c5IiIz+7iqVmB7Hwp4OMa2nhhwN/PRGEMBh3Zjt6KfpzPztxW9MSAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzAMwzB8HS+J9kUTvzEDMwAAAABJRU5ErkJggg==) left top repeat-y;
border: 1px solid #ccc;
padding: 10px 10px 10px 21px;
max-height:1000px;
line-height: 1.2em;
}
</style>
5.重複第二步驟再新增一個新的HTML/JavaScript,並複製以下文字
![]() |
| 新增第二個HTML/JavaScript |
<script src="//google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script>
6.如果程式碼內,有<>的符號時,如:new list<>,請先到點我網站,將程式碼轉成HTML編碼,先在上面的方框輸入原始程式碼,按下Encode,就可以把Encode出來的程式碼拿來進行下一個步驟。
![]() |
| 貼上程式碼後按Encode,下方就是HTML編碼的程式碼 |
7.接下來就只要再新增文章的時候切換到HTML
![]() |
| 切換到HTML編輯模式 |
![]() |
| 找到適當位置放上包圍語法 |
<pre class="codeblock prettyprint"> new list<> 上下這兩段語法就是要把你想要呈現出來的程式碼包住~! </pre>














