【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>>
最近对hexo和NexT博客又做了一次定制。
1 增加clustrmaps
这回在博客里增加一个clustrmaps的地球点击效果,之前尝试了下,失败了,这回成功显示了。这个功能需要先在这个网页注册。效果如图:
后面只需要把对应的代码添加到文件中。有人推荐放到这个路径下:themes\next\layout_partials\footer.swig。这个是放在底部的,最后我是放在了侧边栏下。侧边栏的路径为themes\next\layout_custom\sidebar.swig。也有人放在themes\next\layout_partials\header.swig。但这个路径不适合我目前这个NexT的样式。
2 视频播放
增加了一个视频播放的功能,首先先安装dplayer。
npm install hexo-tag-dplayer --save
然后使用方法如下,给一个样例。详细文档参见官方地址
{% dplayer key=value ... %}
这里展示一个上海陆家嘴变化的视频。
{% dplayer "url=http://blog.gisersqdai.top/shanghaiurbandevlopment.mp4" "api=https://api.prprpr.me/dplayer/" "pic=http://blog.gisersqdai.top/shud.jpg" "id=9E2E3368B56CDBB4" "loop=yes" "theme=#FADFA3" "autoplay=false" "token=tokendemo" %}
3 pdf预览
以防以后展示ppt和论文等功能,这里添加一个pdf预览功能。也是先安装插件。
npm install --save hexo-pdf
使用方法如下:
正常的pdf(有直链)。
{% pdf http://xxx.pdf %}
或者
{% pdf ./xxx.pdf %}
此外也可以用google drive和slideshare。
这里显示下之前的一篇论文。
{% pdf "http://gisersqdai.top/mycv/201702.pdf" %}
4 增加天气卡片
增加了一个右上角的天气卡片。效果如图。
首先在这个页面注册。然后在这里输入名称生成代码。
最后放到themes\next\layout_custom\header.swig中。
5 主题自定义设计
主要是做了背景图切换之类的设置,比较简单。参照以下的这个修改的。文件为themes\next\source\css_custom\custom.styl。
https://github.com/reuixiy/reuixiy.github.io/blob/master/custom.styl
参考链接:
来源:oschina
链接:https://my.oschina.net/u/2424163/blog/3146457