Hexo折腾记
自定义404页面
直接在根目录(指的不是Hexo目录下,而是Hexo/source目录下)下创建自己的 404.html 就可以。如腾讯公益404页面:
<html>
<head>
<meta charset="UTF-8" />
<title>404 | Hacker's Blog</title>
</head>
<body>
<script type="text/javascript" src="http://www.qq.com/404/search_children.js" charset="utf-8"></script>
</body>
</html>
启用第三方评论系统
静态博客只能使用第三方评论系统,在此整合多说为例。直接用你的微博/豆瓣/人人/百度/开心网帐号登录多说。同时修改当前主题的配置文件,比如/themes/jacman/_config.yml,找到选项duoshuo_shortname, 替换成你的账号即可:
#### Comment
duoshuo_shortname: sunblognuke ## e.g. wuchong your duoshuo short name.
disqus_shortname: ## e.g. wuchong your disqus short name.
你也可以在多说后台自定义CSS,比如评论头像鼠标悬停旋转效果和隐藏多说底部版权,代码如下:
.ds-avatar{-webkit-border-radius: 5px !important;/*圆角效果:兼容webkit浏览器*/
-moz-border-radius:5px !important;
box-shadow: inset 0 -1px 0 #3333sf !important;/*设置图像阴影效果*/
-webkit-box-shadow: inset 0 -1px 0 #3333sf !important;
-webkit-transition: 0.4s !important;
-webkit-transition: -webkit-transform 0.4s ease-out !important;
transition: transform 0.4s ease-out !important;/*变化时间设置为0.4秒(变化动作即为下面的图像旋转360度)*/
-moz-transition: -moz-transform 0.4s ease-out !important; }
.ds-avatar:hover{box-shadow: 0 0 10px #fff !important; rgba(255,255,255,.6), inset 0 0 20px rgba(255,255,255,1) !important;
-webkit-box-shadow: 0 0 10px #fff; rgba(255,255,255,.6), inset 0 0 20px rgba(255,255,255,1) !important;
transform: rotateZ(360deg) !important;/*图像旋转360度*/
-webkit-transform: rotateZ(360deg) !important;
-moz-transform: rotateZ(360deg) !important;}
/*隐藏多说底部版权*/
#ds-thread #ds-reset .ds-powered-by {
display: none;
}
更多教程参看《多说CSS修改》
整合Swiftype站内搜索
更新:swiftype开始收费,目前这一设置对大部分已经不实用了。
参考这两篇教程:
步骤大概如下:
新建文件swiftype_search.ejs,代码如下:
<% if (theme.swiftype_search.enable){ %> <script type="text/javascript"> (function(w,d,t,u,n,s,e){w['SwiftypeObject']=n;w[n]=w[n]||function(){ (w[n].q=w[n].q||[]).push(arguments);};s=d.createElement(t); e=d.getElementsByTagName(t)[0];s.async=1;s.src=u;e.parentNode.insertBefore(s,e); })(window,document,'script','//s.swiftypecdn.com/install/v2/st.js','_st'); _st('install','<%= theme.swiftype_search.id %>','2.0.0'); </script> <% } %>
添加代码到文件after_footer.ejs:
<!-- Swiftype_search Begin --> <%- partial('swiftype_search') %> <!-- Swiftype_search End -->
添加配置项到主题文件_config.yml
swiftype_search: enable: true id: "zpAq-EQUfMzEzP6ybWEU" ## e.g. "zpAq-EQUfMzEzP6ybWEU" for your swiftype search id
添加class - st-default-search-input到header.ejs
部署Github的README.md
如何部署Github时保证README.md不被渲染:
添加README.md文件:Hexo目录下的source根目录下创建README.md文件,编辑保存。
防止README.md被渲染:编辑Hexo目录的_config.yml文件中的“skip_render”参数,skip_render: README.md