注冊博客園快兩年了，之前偶爾來這里看看一些大牛連載的技術文章或者發些問題求助帖。最近幾個月空閑時間多了點，幾乎每天都會來博客園看看，時不時寫些自己的技術心得與總結。
在自己摸索博客園的過程中越來越覺得博客園的可擴展性還挺強大的。在這里代表所有博主，所有游客，感謝dudu站長一直以來的良苦用心。
我這里的可擴展性強大主要是針對后台的設置功能（添加QQ即時聊天、百度分享、博客流量統計等）。如圖
1.自定義樣式風格。可以選擇博客園自帶的風格，也可以自定義風格，看過一些園友自定義的效果很拉風，好生羡慕。由於本人前端水平有限，沒有去刻意擺弄這個。
2.公告自定義編輯。這里可以放些關於自己的介紹信息，訂閱地址，自己公司或個人的產品或服務地址等等。這里我推薦幾個我正在用的功能，感覺挺有用，效果如下。
A.即時QQ消息（如果你像我一樣喜歡廣交技術朋友這個真心不錯）代碼如下，需要把紅色的兩處號碼替換成你自己的qq號碼：
<a style="padding-right:20px;" href="http://wpa.qq.com/msgrd?v=3&uin=373810510&site=qq&menu=yes" target="_blank"><img style="vertical-align:bottom; border:0px" src="http://wpa.qq.com/pa?p=1:373810510:13" alt="點擊這里給我發消息"></a>
B.今天看一個園友的博客，看他在公告的時間動畫效果不錯，就拿來了，如上圖所示，代碼如下：
<div id="myTime"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="160" height="70" id="honehoneclock" align="middle"><param name="allowScriptAccess" value="always"><param name="movie" value="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_wh.swf"><param name="quality" value="high"><param name="bgcolor" value="#ffffff"><param name="wmode" value="transparent"><embed wmode="transparent" src="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_wh.swf" quality="high" bgcolor="#ffffff" width="160" height="70" name="honehoneclock" align="middle" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></object></div>
C.統計博客流量。比方說你是個大牛，對博客園貢獻很大，甚至百度一下某個技術的關鍵詞，你老人家就排在首頁。對你經營好博客來說，統計無疑很有用。本人才疏學淺，現在加個統計功能只是打打醬油，裝裝比o(∩_∩)o 哈哈。我用的51.la統計，你可以注冊51.la，然后給你博客地址加入統計ID，獲取統計代碼，放在公告部分即可。有了這個以后，你可以知道最近有多少人來看你博客，看了你的哪篇博客，從哪個網站過來的。
3.百度分享按鈕。這個為什么單獨拿出來介紹，如果用的好，可以讓你的博客更有影響力，不僅僅是在博客園的影響力，乃至全網的排名。它具有如下功能：
- 分享數據與搜索引擎深度結合
- 部署多種風格的分享按鈕
- 查看詳盡的數據統計分析
代碼如下，放在頁首Html里面，加上之后每一篇博客頁都懸浮着分享按鈕：
<!-- Baidu Button BEGIN --> <script type="text/javascript" id="bdshare_js" data="type=slide&img=0&pos=right&uid=6507240" ></script> <script type="text/javascript" id="bdshell_js"></script> <script type="text/javascript"> document.getElementById("bdshell_js").src = "http://bdimg.share.baidu.com/static/js/shell_v2.js?cdnversion=" + Math.ceil(new Date()/3600000); </script> <!-- Baidu Button END -->
以上是我目前的一些發現，園子里玩這個比我牛逼的估計多如牛毛，我最大的缺點就是有什么好東西我一般都會拿出來與大家分享。
我最近看到一個園友的文章評論加入了氣泡效果，挺拉轟的，我今天研究了下，想拿過來，未果。在這里把地址貼出來，有興趣一起研究研究：http://www.cnblogs.com/heyuquan/archive/2012/12/31/2840214.html，誰開放教程了，別忘記了艾特（@）我哦。:-)
可能是人品爆發，被我研究的氣泡效果博主 @滴答的雨，無償把技術傳授給我了，具體效果請欣賞下面的評論效果，可以評論下試試:-D，對我們屌絲群體是巨大的福利啊~~~感激之余我把代碼貼出來：
通過css定制頁面風格：
View Code
1 /*評論*/ 2 #tbCommentBody{ 3 width:500px; 4 } 5 #btn_comment_submit{ 6 width: 80px; height: 28px; 7 } 8 .feedbackListSubtitle div{ 9 margin:5px 10px 5px 10px; 10 } 11 12 .blog_comment_body fieldset.comment_quote 13 { 14 border-color:#1a8bc8; 15 } 16 /*美化一下評論，增加氣泡效果*/ 17 18 .feedbackListSubtitle{ 19 border:0px none; 20 border-bottom-style:none; 21 } 22 .list {width:90%; } 23 .list .out,.list .inc{margin:6px 0;width:90%;} 24 .list .out .icon,.list .inc .icon{width:48px;height:48px;} 25 .list .icontd {width:48px;} 26 .list .out .icontd{display:none;} 27 .list .out .topleft,.list .out .topright,.list .out .bottomleft,.list .out .bottomright,.list .inc .topleft,.list .inc .topright,.list .inc .bottomleft,.list .inc .bottomright{background: url(http://www.cnblogs.com/images/cnblogs_com/heyuquan/406488/t_o_bubbles.png) no-repeat;} 28 .list .out .top,.list .out .bottom,.list .inc .top,.list .inc .bottom{background:transparent url(http://www.cnblogs.com/images/cnblogs_com/heyuquan/406488/t_o_horizontal.png) repeat-x;} 29 .list .out .left,.list .out .right,.list .inc .left,.list .inc .right{background:transparent url(http://www.cnblogs.com/images/cnblogs_com/heyuquan/406488/t_o_vertical.png) repeat-y;} 30 31 .list .out .topleft{background-position:left top;height:9px;width:18px;} 32 .list .out .topright{background-position:-18px top;height:9px;width:11px;} 33 .list .out .bottomleft{background-position:left -9px;width:18px;height:12px;} 34 .list .out .bottomright{background-position:right -9px;width:11px;height:12px;} 35 .list .out .top{background-position:top;font-size:1px;height:9px;} 36 .list .out .bottom{background-position:0 -9px;height:12px;} 37 .list .out .left{background-position:left;width:18px;} 38 .list .out .right{background-position:-18px 0;width:11px;} 39 40 .list .inc .topleft{background-position:0 -21px;height:9px;width:18px;} 41 .list .inc .topright{background-position:-18px -21px;height:9px;width:11px;} 42 .list .inc .bottomleft{background-position:0 bottom;width:18px;height:12px;} 43 .list .inc .bottomright{background-position:right bottom;width:11px;height:12px;} 44 .list .inc .top{background-position:0 -21px;font-size:1px;height:9px;} 45 .list .inc .bottom{background-position:bottom;height:12px;} 46 .list .inc .left{background-position:-29px 0;width:18px;} 47 .list .inc .right{background-position:right;width:11px;} 48 49 .list .inc .conmts{font-size:12px;color:#000;} 50 .list .out .conmts{background:#dcdcdc;/*text-shadow:0 1px 0 #eee;*/} 51 .list .inc .conmts{background:#c0e668;/*text-shadow:0 1px 0 #dfa;*/}
頁腳Html代碼（注：代碼里面有個顯示頭像的圖片地址，需要替換成你自己的博客頭像地址）
View Code
1 <!--評論，生成氣泡效果標簽代碼--> 2 <script type="text/javascript" language="javascript"> 3 $(document).ready(function() { 4 var commentTime = setInterval(function(){if($("#comments_pager_bottom").length>0){CommentBubble();clearTimeout(commentTime);}},50); 5 }); 6 function CommentBubble() 7 { 8 var w1 = '<div class="list">' + 9 '<table class="out" border="0" cellspacing="0" cellpadding="0"> ' + 10 '<tr>' + 11 '<td class="icontd" align="right" valign="bottom">' + 12 '<img src="http://images.cnblogs.com/cnblogs_com/heyuquan/406488/t_op.png" width="70px" height="57px"/>' + 13 '</td>' + 14 '<td align="left" valign="bottom" class="q">' + 15 '<table border="0" cellpadding="0" cellspacing="0" style=""> ' + 16 '<tr><td class="topleft"></td><td class="top"></td><td class="topright"></td></tr> ' + 17 '<tr><td class="left"></td> <td align="left" class="conmts"><p>'; 18 19 20 var w2 = '</p> </td> <td class="right"></td></tr> ' + 21 '<tr><td class="bottomleft"></td><td class="bottom"></td><td class="bottomright"></td></tr> ' + 22 '</table>' + 23 '</td> ' + 24 '</tr> ' + 25 '</table> ' + 26 '</div>'; 27 28 $.each($(".blog_comment_body"), function(i, t) { 29 $(t).html(w1 + $(t).html() + w2); 30 }); 31 $(".louzhu").closest(".feedbackItem").find(".out").removeClass("out").addClass("inc"); 32 /*.find(".q").attr("align","right");*/ 33 } 34 </script>
正在看本人博客的這位童鞋，我看你氣度不凡，談吐間隱隱有王者之氣，日后必有一番作為！旁邊有“推薦”二字，你就順手把它點了吧，相得准，我分文不收；相不准，你也好回來找我！