全網最全的部落格美化系列教程相關文章目錄

【全網最全的部落格美化系列教程】09.新增"擴大/縮小瀏覽區域大小" 按鈕

【全網最全的部落格美化系列教程】10.小火箭置頂特效的實現

【全網最全的部落格美化系列教程】11.滑鼠點選愛心特效的實現

【全網最全的部落格美化系列教程】12.修改滑鼠圖案

【全網最全的部落格美化系列教程】13.滑鼠點選效果升級的實現

【全網最全的部落格美化系列教程】14.程式碼高亮設定的實現

【全網最全的部落格美化系列教程】15.動畫幻燈效果的實現

【全網最全的部落格美化系列教程】16.給部落格新增一個打賞的實現

【全網最全的部落格美化系列教程】17.部落格背景重新整理切換效果的實現

【全網最全的部落格美化系列教程】18.數學之美---動態幾何線條的實現

【全網最全的部落格美化系列教程】19.旋轉立方體的實現

【全網最全的部落格美化系列教程】20.給部落格新增一個萌萌噠的看板娘

【全網最全的部落格美化系列教程】21.給部落格新增一個夜間模式吧

【全網最全的部落格美化系列教程】22.新增一個文章目錄特效

【全網最全的部落格美化系列教程】23.圖片水紋特效的實現

【全網最全的部落格美化系列教程】24.給部落格增加一個音樂播放器特效

【全網最全的部落格美化系列教程】25.給部落格增加一個音樂播放器特效

【全網最全的部落格美化系列教程】26.評論頭像旋轉的實現

【全網最全的部落格美化系列教程】27.IP地址定位及天氣預報的實現

【全網最全的部落格美化系列教程】28.3D標籤雲動畫的實現

【全網最全的部落格美化系列教程】29.自制HTML原始碼執行Javascript特效

【全網最全的部落格美化系列教程】30.部落格文章實現markdown書寫機制

【全網最全的部落格美化系列教程】31.用Canvas和requestAnimFrame做動畫特效

【全網最全的部落格美化系列教程】32.公告欄新增自己的頭像

【全網最全的部落格美化系列教程】33.新增一隻舞動的小知音

【全網最全的部落格美化系列教程】34.面板背景的選擇與定製

自定義位址列Logo

效果如上圖所示~

那麼我們如何去自定義位址列logo呢？

首先，我們得準備一個icon型別的檔案~

首先你得準備一張png或者jpg/jepg的圖片，這個時候你可能會想要你的部落格頭像作為圖片，你只需要這樣子：

上傳成功後點擊下載icon圖示

進入自己的部落格後臺管理->檔案->選擇檔案->上傳，然後點選已上傳的檔案，copy這個檔案的網路地址

然後再進入自己的部落格園->設定，將以下JavaScript程式碼新增到“頁尾Html程式碼”

<script type="text/javascript" language="javascript">
　　//Setting ico for cnblogs
　　var linkObject = document.createElement('link');
　　linkObject.rel = "shortcut icon";
　　linkObject.href = "https://files.cnblogs.com/files/ECJTUACM-873284962/favicon.ico";
　　document.getElementsByTagName("head")[0].appendChild(linkObject);
</script>

將href種的地址路徑替換成你自己的就好了~

儲存設定後，重新整理頁面，就會看到位址列的圖示變了：