如果是一個技術行的博客，發佈代碼是經常用到的，使代碼高亮顯示，用户體驗大大提高。然而 WordPress 默認的編輯器不好添加代碼，如果你直接從可視化狀態下寫下代碼，很有可能被刪減一些。。所以我們得自己將代碼轉換成 html 實體。
什麼是 html 實體？像 「<」 之類的字符，在 html 中擁有特殊的含義，如果我們要將諸如 「<」 的字符在瀏覽器中正確的顯示出來，我們必須在 html 代碼中使用字符實體，字符實體有三部分：一個和號 (&)，一個實體名稱，或者 # 和一個實體編號，以及一個分號 (;) 。要在 HTML 文檔中顯示小於號 「<」，我們需要這樣寫：< 或者 < 所以我們將要顯示的代碼中的一些符號轉換成 html 實體，這樣瀏覽器就可以正確顯示了。
瀏覽器正確顯示後，我們還需要添加 css 。。才能讓它們高亮顯示。
這兩個工作看起來很複雜，如果手動完成，工作量巨大，所以我們使用工具來完成，有一款小工具：下載 CodeRenderUnmi(摘自知更鳥) 。使用這個小工具，可以將你輸入的代碼全部轉換成 html 實體，並且加上類名。
界面：
你可以選擇你的代碼類型，使得代碼有正確的不同的着色，還可以選擇 Gutter(行號) 、 Columns(列)... 在 Source Code 中粘貼你的原代碼, 然後點擊 Render 就會在下面生成 html 代碼和樣式預覽，點擊 HTML code 哪裏的 copy 複製 html 代碼, 然後將代碼粘貼到文章中，注意粘貼到文章中時, 需要在 html 模式下粘貼, 這樣，代碼已經能正確顯示了。
然後進行着色：小工具壓縮包裏面帶有一個 highlight.css 文件, 它雖然推薦你在頁面頭部添加外部樣式鏈接, 也就是加入下面的代碼：
- <link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/highlight.css" />
但是我不這樣建議你, 這樣會增加打開網頁時的請求次數, 將 highlight.css 中的 css 代碼複製出來, 然後寫入到主題的 style.css 文件中，這才是上上策。這樣整個站點也只有一個 css 文件... 使用其它插件的時候同樣可以自行改動...