最近有人找我要這個主題的代碼,
我就來詳細解答一下這個要怎么弄吧,
寫在前面
配置這些東西,還真的懂一些前端語法,像我這種語法都沒有完全搞懂的垃圾……哎,
教程
材料
1、博客主題選Custom
2、禁用模板默認CSS不要勾選
檔案在這里下載
檔案目錄
CSS.txt
側邊欄.txt
頁腳.txt
main.txt
哦差點搞忘了,側邊欄支持js代碼!!
側邊欄檔案main
要注意的是側邊欄,側邊欄里的大部分都用檔案代替,完全用它給我們的檔案是無法達到自己想要的個性化的,導致很多鏈接(比如頁首導航欄的鏈接都無法更改)會是其他人的,怎么解決呢?我們需要將他給我們的這個js的檔案再行更改,
如果要達到方便,建議在txt里面直接更改,但是保存時我們需要把編碼改為UTF-8,否則亂碼,
txt里面你需要改的地方,
<!--離開頁面改變title-->
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('<li><a id="blog_nav_myhome" href="https://www.cnblogs.com/ttt1493b/p/首頁地址">首頁</a><i></i></li><li><a id="blog_nav_myyoulian" href="https://www.cnblogs.com/ttt1493b/p/友鏈地址">友鏈</a><i></i></li><li><a id="blog_nav_contact" href="https://www.cnblogs.com/ttt1493b/p/留言板地址">留言板</a><i></i></li><li><a id="blog_nav_rss" href="https://www.cnblogs.com/ttt1493b/p/我的隨筆地址">歸檔</a><i></i></li><li><a id="blog_nav_myguanyu" href="">關于</a><i></i></li>');
//添加標簽icon
$('#blog_nav_myhome').prepend('<i aria-hidden="true"></i>');
$('#blog_nav_contact').prepend('<i aria-hidden="true"></i>');
$('#blog_nav_rss').prepend('<i aria-hidden="true"></i>');
$('#blog_nav_admin').prepend('<i aria-hidden="true"></i>');
$('#blog_nav_myyoulian').prepend('<i aria-hidden="true"></i>');
$('#blog_nav_myzanshang').prepend('<i aria-hidden="true"></i>');
$('#blog_nav_myguanyu').prepend('<i aria-hidden="true"></i>');
//添加li內嵌ui
let guanyu = '<ul >' +
'<li><a href="https://www.cnblogs.com/ttt1493b/p/關于1地址"><i aria-hidden="true"></i>關于1</a></li>' +
'<li><a href="https://www.cnblogs.com/ttt1493b/p/關于2地址"><i aria-hidden="true"></i>關于2</a></li>' +
'<li><a href="https://www.cnblogs.com/ttt1493b/p/關于3地址"><i aria-hidden="true"></i>關于3</a></li>' +
'<li><a href="https://www.cnblogs.com/ttt1493b/p/關于4地址"><i aria-hidden="true"></i>關于4</a></li>' +
'</ul>';
$('#blog_nav_myguanyu').after(guanyu);
}
//博客logo
var title = '<div >' +
'<span >' +
'<a href="https://www.cnblogs.com/ttt1493b/p/首頁地址" alt="隨便">' +
'<ruby><span >前面</span><span >中間</span><span >后面</span>' +
'<rt >下面</rt></ruby></a></span>' +
'</div>'
$('body').prepend(title);
這個可以研究一下,
main檔案以后綴js的形式上傳網路,放在側邊欄<script src=""></script>引號中間
側邊欄代碼
側邊欄有一段代碼,可以直接更改main檔案里面的引數,
<script src=""></script>
<script type="text/javascript">
$.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就好,沒有其他的了,
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/91860.html
標籤:其他
上一篇:概率統計14——幾何分布
