博客園已經很不錯了，但作為比較“挑剔”的用戶，在使用的過程中，還是有一些地方不爽的。
我不是一個專業的前台程序員，也只能憑借自己蹩腳的JS和CSS知識完成對頁面的小改造（專業的大蝦莫要鄙視呀。。）。
這里給大家分享出來，博大家一笑。覺得有用的可以直接拿去。（本來也沒啥技術含量的）
先說說我不習慣的部分：
1、在大概掃一眼別人寫的博客的時候，我就有“推薦”或者“反對”沖動，
可是，兩個按鈕在哪兒呢？ 在正文的最底部，我還得拉到最底部才能完成對一篇文章的“批判”。
2、一般比較負責任的博客（篇幅比較小的例外，例如本文），都會有目錄，這樣讀者讀起來也方便，直接讀自己感興趣的章節就好了。
於是乎，點擊了某段的鏈接，讀完該段之后，想回到目錄處。這個時候咋辦呢？ 我次啊，要么到對底部，點擊返回頂部，要么用滾輪滾到頂部。
也許有的人說，那有什么啊。但對於“挑剔”的“懶惰”的我，那簡直是噩夢。
3、如果覺得文章比較靠譜，也比較合口味，通常情況下就會關注博主，但是我到哪里找博主呢？
如果沒有對模板進行改動的話，博主一般在正文的最底部。
4、如果文章哪里寫的比較好，或者哪里寫的和自己想的有些出入，我想要“吐槽”，這時候要咋整？
Oh god 還在最底部，作為像我這樣記性不好人來說，沒准剛滑到底部我就忘了“槽點”了。
開始動手DIY
第一步：查看“推薦”、“反對”的元素
可以看到 “推薦”和“反對” 元素共同在一個ID為 div_digg 的div元素中。圖中中間紅框部分是該元素的CSS代碼。
我想讓它鎖定在正文的右下方，保持不動。於是就在博客設置->頁面定制CSS代碼里添加該元素的CSS代碼。
#div_digg { position: fixed; bottom: 0px; right: 250px; padding: 8px 8px 8px 10px; background-color: #fff; border: 1px solid #D9DBE1; }
就可以達到我想要的效果了。這里我想說的是，具體的位置得根據每個人使用的博客模板設定。
第二步：在第一步的基礎上，往該元素上添加元素“關注博主”。
原理是這樣的，在元素中添加一個子元素，子元素有鏈接到“加關注”的JS函數。
關注的JS函數已經存在了，我能只需要找到這個函數名就可以了。（關於怎么查找的，應該很簡單，由於要截很大的圖，這里就略過了。）
函數名為c_follow(); 但是你要是用JS功能，你得申請JS權限，給人家發個郵件說明下就好了。
我要做的就是找到父元素，生成一個新元素，添加到父元素中即可。廢話少說，看代碼。
1 <head> 2 <script type="text/javascript"> 3 4 /*在div_digg中添加關注鏈接*/ 5 var div_digg = document.getElementById("div_digg"); 6 7 var my_div = document.createElement("div"); 8 my_div.style.padding="0 0 5px 0"; 9 my_div.innerHTML = "<a onclick=\"javascript:c_follow"+"();\" href=\"javascript:void(0);\" style=\"font-weight: bold; padding-left: 5px;\">關注 Googny</a>" 10 11 div_digg.insertBefore(my_div,div_digg.firstChild); 12 /*添加關注鏈接結束*/ 13 </script> 14 </head>
這里要說明一個問題，第9行代碼中的onclick屬性，我將c_follow(); 分在了字符串的兩部分中。
我這樣做的原因是：如果我寫成 c_follow();后，在我保存之后再看這段代碼，c_follow() 被空字符串代替了。
我明明申請了JS的使用權限的，而且也得到肯定的回復了，為什么還要這樣？（現在還不太明白）所以我將函數調用分在了兩個字符串的兩部分。
效果如下圖所示：
第三步：添加"快速評論"和"返回頂部"功能：
先給出代碼（在第二步的基礎上），再進行分析。
1 <head> 2 <script type="text/javascript"> 3 function focusFunction(){ document.getElementById("tbCommentBody").focus(); } 4 5 /*在div_digg中添加關注鏈接*/ 6 var div_digg = document.getElementById("div_digg"); 7 8 var my_div = document.createElement("div"); 9 my_div.style.padding="0 0 5px 0"; 10 my_div.innerHTML = "<a onclick=\"javascript:c_follow"+"();\" href=\"javascript:void(0);\" style=\"font-weight: bold; padding-left: 5px;\">關注 Googny</a>" 11 12 div_digg.insertBefore(my_div,div_digg.firstChild); 13 /*添加關注鏈接結束*/ 14 /*添加評論快速入口*/ 15 document.getElementById("digg_tips").innerHTML = "<a onclick=\"javascript:focusFunction();\" href=\"javascript:void(0);\" style=\"font-weight: bold; padding-left: 5px;\">快速評論</a> <a href=\"#top\" style=\"font-weight: bold; padding-left: 5px;\">返回頂部</a>"; 16 17 </script> 18 </head>
首先 在第3行聲明一個函數 focusFunction () ，該函數通過ID獲取textarea元素，並獲取焦點。
然后在第15行添加元素到digg_tipps元素（其實就是將原來元素里的內容“(請您對文章做出評價)”給覆蓋了）。
=====修正未登錄客戶快速評論無響應bug====
function focusFunction(){ var tbEl = document.getElementById("tbCommentBody"); if(tbEl) tbEl.focus(); else window.location.href = "http://passport.cnblogs.com/login.aspx?"; }
=====完畢（那些點反對的人難道是為了幫樓主測試bug的嗎？放心，我沒有把推薦的響應函數放在反對上。）=====
最終結果如圖所示：
好了，這樣是不是方便讀者許多，雖然沒啥技術含量，但是的確很爽。
如果你覺得這個想法不錯，分享給更多的人吧，不要錢的喲。
更多內容盡在這里：相關博客一覽表