博客主題更新了


cover

博客主題更新了

Update:修改了一些小bug和細節(可能看不出來)

當當當,經過博主一點一點的修改(其實是懶得改),博客主題終於迎來一次重大更新。本來想需要的人自己從控制台扒代碼,不打算發布,然而仍有不熟悉前端的同學向我發出請求。本着互聯網共享精神,特地發布當前博客主題

注意:Wider本人也不熟悉前端知識,都是平時有時間瞎搗鼓,寫的代碼冗長且可能存在未知bug,不一定能及時更新哦

特性

加入特色圖片

介紹

博客首頁文章卡片增加特色圖片功能,效果詳見我的博客首頁,能大幅度增加博客美觀度,建議用簡單不雜亂的圖片。

用法

添加新隨筆時,在高級選項中摘要旁點擊 “插入摘要右側圖片” 即可,注意當前的方法存在缺陷,即插入圖片后,如果摘要不寫文字,那么博客不會自動截取文章內容當作摘要的。所以,文章的摘要要自己寫。

增加博客頭部泡泡特效


如果不喜歡,那么可以在頁腳js代碼中刪掉

addListeners();
initHeader();

這兩行代碼

功能按鈕轉移到側邊欄

以前的功能按鈕是放在一個菜單里的

現在直接放在外面,如圖:

多彩標簽

隨筆分類及標簽分類會自動隨機幾種顏色

若想修改隨機色請轉頁面定制 CSS 代碼1618行

更改配色

粉紅和粉藍,感覺萌萌噠

細節

增加回到頂部按鈕,卡片圓角效果,卡片翹角陰影,平滑滾動效果,卡片放大效果,頁面布局修整,文字排版優化等等。

其他待填坑

使用

下載地址

Wider的博客主題2

使用須知

  • sidebar.html
    • 請將第 3,4 行中 ********** 替換為自己的Blog 地址名
  • foot.html
    • 請將第 11 行中prepend后信息(QQ,github,Wechat,Email)進行個性化修改
    • 請將第 17 行中 ********** 替換為自己的Blog 地址名
    • 請將第 67 行 https://**********.gif (網站的小圖標)改為自己喜歡的圖標
    • SmoothScroll會影響性能,若不需要請刪去第 2 行
    • 泡泡特效會影響性能,若不需要請刪去 140,141 兩行的 addListeners(); initHeader();
  • my.css
    • 請將第 44 行 **********.jpg (頂部背景圖片)改為自己喜歡的圖片
    • 請將第 84 行 **********.png (頭像圖片)改為自己的頭像
    • 第 33 行的圖片鏈接為頁面紋理,需要修改的同學請在此處修改
    • 第 1804 行開始到第 1896 行為代碼高亮樣式,需要修改的同學請訪問highlight.js下載代碼主題
    • 若想修改隨機色請轉CSS代碼 1618 行

聲明

重要的事情說三遍,一定不能照搬別人的博客,要個性化、個性化、個性化!

因為沒怎么學過前端,Wider搞這個主題花了好大力氣,碼這篇文章也用了好大力氣,請各位使用本主題不要忘記在我的留言板上留言哦~~

本人學務繁忙,因此無法及時回復各位的問題,請大家見諒

感謝

由於博客多數部件由他處搬運而來,再此感謝各位不知名的大佬,另外,本主題使用如下開源框架:

  • MathJax
  • FontAwesome
  • SmoothScroll

2019.11.5


免責聲明!

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



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