阿新 • • 發佈:2020-03-11
> 我是Mj,點選右下方"+"一鍵關注我.如果你喜歡我的文章,那麼拒絕白嫖行為.然後..請多來做客鴨.
## 前言
沒什麼題材,把小號的文章搬過來.
最近有人找我要這個主題的程式碼。
我就來詳細解答一下這個要怎麼弄吧。
這是具體如何配置版,有些細節靠你自己腦補或搜尋其它文章(我心想這篇文章你都找到了,其他熱度更高的你還找不到?)
預覽:
![](https://pic.downk.cc/item/5e68acd4e83c3a1e3a71221c.png)
## 教程
### 材料
1、部落格主題選Custom
2、禁用模板預設CSS**不要**勾選
[檔案在這裡下載](https://files.cnblogs.com/files/Areds/%E5%8D%9A%E5%AE%A2%E5%9B%AD%E7%BE%8E%E5%8C%96Code.rar)
檔案目錄
```
CSS.txt
側邊欄.txt
頁尾.txt
main.txt
```
哦差點搞忘了,側邊欄支援js程式碼!!
### 側邊欄檔案main
要注意的是側邊欄,側邊欄裡的大部分都用檔案代替,完全用它給我們的檔案是無法達到自己想要的個性化的,導致很多連結(比如頁首導航欄的連結都無法更改)會是其他人的,怎麼解決呢?我們需要將他給我們的這個js的檔案再行更改。
如果要達到方便,建議在txt裡面直接更改,但是儲存時我們需要把編碼改為UTF-8,否則亂碼。
txt裡面你需要改的地方。
```
var time;
var normar_title = document.title;
document.addEventListener('visibilitychange', function () {
if (document.visibilityState == 'hidden') {
clearTimeout(time);
document.title = '離開時的欄位';
} else {
document.title = '回來時的欄位';
time = setTimeout(function () {
document.title = normar_title;
}, 3000);
}
});
```
***
```
$("#navList").append('首頁 友鏈 留言板 歸檔 關於 ');
//新增標籤icon
$('#blog_nav_myhome').prepend('');
$('#blog_nav_contact').prepend('');
$('#blog_nav_rss').prepend('');
$('#blog_nav_admin').prepend('');
$('#blog_nav_myyoulian').prepend('');
$('#blog_nav_myzanshang').prepend('');
$('#blog_nav_myguanyu').prepend('');
//新增li內嵌ui
let guanyu = ' ';
$('#blog_nav_myguanyu').after(guanyu);
}
```
***
```
//部落格logo
var title = '' +
'' +
'' +
'前面中間後面' +
'' +
''
$('body').prepend(title);
```
這個可以研究一下。
**main檔案以後綴js的形式上傳網路,放在側邊欄``````引號中間**
### 側邊欄程式碼
側邊欄有一段程式碼,可以直接更改main檔案裡面的引數。
```
$.silence({
profile: {
enable: true,
avatar: '',
favicon: 'https://files-cdn.cnblogs.com/files/zouwangblog/blog_logo.gif',
notice: ''
},
```
我們看到這裡第一行的src是空的,這裡需要你上傳更改好的main檔案上傳至網路(部落格園就可以)。找到main檔案地址填入src。
除了第一行以外就是main檔案裡面的引數了,這裡是你可能需要改的程式碼。
avatar:頭像地址
notice:公告
home:首頁地址
wechat:微信支付圖片地址
alipay:支付寶支付圖片地址
***
```
homeTopImg: [
"",
],
notHomeTopImg: [
"",
]
```
homeTopImg是主頁的圖片,引號裡面是圖片地址,可以放多個圖片地址,用引號括起來,逗號隔開;
notHomeTopImg是隨筆頂部圖片,引號裡面是圖片地址,可以放多個圖片地址,用引號括起來,逗號隔開。
***
```
title: '首頁標題',
text: '座右銘',
github: "github地址",
weibo: "微博地址",
telegram: "",
music: "網易雲",
twitter: "",
zhihu:"知乎",
mail: "郵我",
```
這一段裡面雙引號裡面都是地址,註釋已經標註好(*^▽^*)
### CSS與頁尾
這裡照常copy就好,沒有其他