首先，需要在您的 Google blogger，點選「設計」，
介面上找「編輯HTML」，
點選「編輯範本」，然後在編輯視窗中，按 Ctrl+F 輸入關鍵字 </head>
在前面貼上：
<script src='https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js'/></script>
再尋找 .post-body
在前面一行插入貼上以下程式碼：
.post .code {
display: block; /* fixes a strange ie margin bug */
font-family: Courier New;
font-size: 10pt;
overflow:auto;
background: #f0f0f0 url(http://你的圖檔位置/Code_BG.gif) left top repeat-y;
border: 1px solid #ccc;
padding: 10px 10px 10px 21px;
max-height:200px;
line-height: 1.2em;
}
按下儲存範本，設定完成。
皆下來，只要在HTML模式下，將您的程式碼以：
<pre class="code prettyprint">
程式碼
</pre>
就可以有程式碼區塊效果。
如果需要加上行數標示，
可以在<pre class="code prettyprint
linenums" >
此標籤也會幫您每5行標示出行數。
但若要每一行都標出「行數」，則需在HTML碼中加入
<style>
li.L0, li.L1, li.L2, li.L3,
li.L5, li.L6, li.L7, li.L8
{list-style-type: decimal }
</style>
結果會是：
#include
main()
{
printf("Hello World!\n");
}
旁邊灰色的CODE圖，請上網查詢link再將正確位置填入。
