葡萄園: 為網站增添網頁圖標(favicon)~~讓你的部落格金嚇嚇

2009年1月23日

為網站增添網頁圖標(favicon)~~讓你的部落格金嚇嚇

瀏覽器的網址列及我的最愛之前會有一個小小圖標
代表這個網站的一個標記稱為favicon(favorites icon)
網址列圖示
標籤(tab)圖示

用的就是這張圖

要怎麼為你的部落格建立自己的網頁圖標呢

1.到FavIcom from Pics網站，可以上傳一張圖片，就可以下載該圖的icon圖示(.ico)

2.或是你很有繪畫天分，可以在Favicon.cc直接著色編輯

3.在blog的html編輯區在<head>...</head>中插入以下兩行程式碼
<link rel="shortcut icon" href="http://example.com/favicon.ico" type="image/vnd.microsoft.icon">
<link rel="icon" href="http://example.com/favicon.ico" type="image/vnd.microsoft.icon">

4.若是blogger使用者，則要放在<title><data:blog.pageTitle/></title>之後

經過測試，使用FF瀏覽完全沒問題；
使用IE的話，首頁的圖標不會出現，只有文章分頁出現；
使用google chrome的話，一定要加入type="image/vnd.microsoft.icon"才會正常顯示喔

參考：電腦玩物, 星空小鴨, wiki,