实现效果
如何实现
准备材料
首先需准备想要显示的图标文件,以png为佳,大小32×32(自带社交账号图标都为16×16,亲测后发现不好用,32×32比较合适)
详细过程
图标位置
自带图标的放置位置为themes/yilia/source/img
修改style文件
打开themes/yilia/source/css/_partial/main.styl
查找类似123456a.mail { background:url('/img/mail.png') center no-repeat #005a87; border:1px solid #005a87; &:hover { border:1px solid #006b98; }
的代码
复制一段放在相同的位置,修改其中的函数名和图标位置。图标样式和背景色可自行修改。
修改config文件
打开themes/yilia/_config.yml
在subnav:
下添加一行超链接,指向你想引向的网址
格式类似github: “https://github.com/xyzardq“
实现到此全部完成,部署后即可查看效果。