预览地址:http://yumemor.github.io/hexo-theme-varaint
先感谢原作者,这个主题是我无意逛 wordpress 看见的 感觉很简洁。在争取到作者的同意下 开始了移植工作。
默认情况下 首页的 banner 每一次加载都会随机变动,如果想更改随机策略 ,到 /theme/hexo-theme-varaint/source/js/script.js:
var bannerNode = $('.top-image');
if(bannerNode.data('enable')){
var index = parseInt((Math.random() * 4) + 1);
bannerNode.attr('style','background-image:url(/banner/'+index+'.jpg)');
}
进行更改。
如果想给文章添加 banner,可以在文章中添加:
---
title: Hello World
banner: http://oct8d1mqf.bkt.clouddn.com/2016-10-12-Video%20Background%20-%20Looping%20Cloud%20Animation-00-00-00-000.jpg
---
search:
enable: true #是否启用
placeholder: Enter Key...
comments:
duoshuo_username: yumemor
#disqus_username: yumemor
在国内的话还是建议大家使用多说,disqus 必须要翻墙。
sidebar:
enable: true #是否启用
menus:
-
name: Weibo
link: http://weibo.com/yumemor/
target: _blank
social:
-
name: weibo
link: http://weibo.com/yumemor/
-
name: github
link: https://github.com/yumemor
-
name: zhihu
link: https://www.zhihu.com/people/yumemor
这里没有使用 Hexo 自带的 highlight
,而是用了 google-perttify
,所以请先关闭 highlight
在 _config.yml 文件中:
highlight:
enable: false
line_number: false
auto_detect: false
tab_replace:
-
高亮风格选择:https://jmblog.github.io/color-themes-for-google-code-prettify/
-
把下载好的 css 文件放在 /theme/hexo-theme-varaint/source/js/google-code-prettify/
-
修改 head.ejs
<%- css('js/google-code-prettify/download.css') %>
如果不关闭 Hexo 默认的 highlight,就会出现下面这种情况
#巴啦啦啦
项目目前没有 page 页面,只有 post 文章页 ,由于原主题没有 category 和 tag 页面 我也在考虑这两个页面到底是加还是不加。
如果你喜欢这个主题 能不能动一动小手 点击下 star , 也欢迎大家 fork 😄
开源项目离不开大家 如果在使用中遇到什么问题,请及时提出来。