博客園訪客統計的實現


 
最近有人讓我把博客園里面關於訪客統計做一篇文章

一直沒有寫,今天就發了吧(對不起呀!!一直沒有時間)

今天我會發多篇文章關於博客園的美化問題。

相信大家也看到了右側公告欄的訪客量統計的效果,我們可以看到有兩個樣式,一個是單獨統計人數的,一個是統計訪客來源的,是不是感覺還挺不錯的?

本文就帶大家一起詳細了解這個樣式的制作過程~~~

首先是數字樣式,效果如下

這個我們通過F12去查看下源碼,我們可以看到如下圖這段源碼:

復制代碼
<div align="center">
<a href="http://www.amazingcounters.com">
<img border="0" src="https://cc.amazingcounters.com/counter.php?i=3214944&amp;c=9645145" alt="AmazingCounters.com">
</a>
</div>
復制代碼

 

我們可以看到,這個樣式來源於這個網站:http://www.amazingcounters.com

下一步我們肯定去訪問下這個網站看看,果真,這個網站提供了大量的訪客量統計的樣式。

我們點擊Browse Over 750 Counter Styles In 24 Categories

里面有大量的樣式供我們選擇~~~就拿我的為例子,我用的是Olde Style,我就一步步教大家怎么弄~~~

首先,點擊Olde Style,然后填入對應的信息,需要注意的是Url是你博客園的地址

然后點擊Create New Account

然后把相應的源碼拷貝出來即可~~

添加方式:進入自己的博客園->設置,將以上html代碼添加到“博客側邊欄公告”

這樣即可完成了頁面訪客量統計,展示效果如下:

然后接着是統計訪客來源了,效果如下:

這個我們用同樣方法通過F12去查看下源碼,我們可以看到如下圖這段源碼:

復制代碼
<a href="https://info.flagcounter.com/G05j">
<img src="https://s07.flagcounter.com/count/G05j/bg_FFFFFF/txt_000000/border_CCCCCC/columns_2/maxflags_250/viewers_0/labels_1/pageviews_1/flags_0/percent_0/" alt="Flag Counter" border="0">
</a>

 

 
復制代碼

我們可以看到,這個樣式來源於這個網站:https://info.flagcounter.com/G05j

下一步我們肯定去訪問下這個網站看看,果真,這個網站提供了自定義訪客來源的樣式。以我的為例子,我們直接點擊Create a FREE Flag Counter!

然后可以根據自己的喜好設置這些參數,點擊GET YOUR FLAG COUNTER

然后填下你的郵箱地址,好像是要驗證信息來着,也可以選擇不填寫,直接Skip跳過即可

然后你就獲得了訪客量來源統計的源碼~~~

添加方式:進入自己的博客園->設置,將以上html代碼添加到“博客側邊欄公告”

這樣即可完成了頁面訪客量來源統計,展示效果如下:

 

至於可能會出現顯示的大小適配問題,你稍微調整一下格式大小就好了~~~

 

作者: 落花四月
關於作者:潛心於網絡安全學習。如有問題或建議,請多多賜教!
版權聲明:本文版權歸作者和博客園共有,歡迎轉載,但未經作者同意必須保留此段聲明,且在文章頁面明顯位置給出原文連接.
特此聲明:所有評論和私信都會在第一時間回復。也歡迎園子的大大們指正錯誤,共同進步。或者直接私信我
聲援博主:如果您覺得文章對您有幫助,可以點擊文章右下角【推薦】一下。您的鼓勵是作者堅持原創和持續寫作的最大動力!
 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM