主题优化
主题配置介绍
我这里只讲自己在使用的 yelle 主题,你可以参考下,可能还有一些改动我后续会自己在慢慢改,但是大体基本也就这样了。
从中我们也可以看出,对于主题来讲,大部分可以配置的地方其实都是在这里的,所以对于主题的使用者来讲,懂这里很重要。
- 基本上主题的配置文件都是有内容改,但是下面这几点我觉得特别重要:
duoshuo,如果你是打算采用多说评论系统的话,你需要设置这里,但是我个人对多说没好印象
youyan,有言也是国内实用比较多的评论系统之一,个人感觉相对比较稳定
open_in_new,我个人觉得这个东西就应该是 true,不是用新标签的都是坏人
baidu_tongji,我个人使用的是百度统计,具体百度统计的使用可以查看百度统计官网:http://tongji.baidu.com
我的 yelle 主题配置
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156
|
menu: 主页: / 关于我: /about/ 标签云: /tags/ 所有文章: /archives/ IntelliJ IDEA: /tags/IntelliJ IDEA
avatar: /img/avatar.png
favicon: /favicon.png
root_url:
subnav: Email: "mailto:judas.n@qq.com" GitHub: "https://github.com/judasn/IntelliJ-IDEA-Tutorial" RSS: "/atom.xml"
disqus: shortname: duoshuo: domain: youyan: on: true id: 1738968
background_image: 0 highlight_style: on: true inline_code: 3 code_block: 2 blockquote_style: on: true blockquote: 3
left_col_width: 330
copyright: true
toc: true
toc_nowrap: true
excerpt_link: more
search_box: false
animate: true
jquery_ui: false
tagcloud: true
friends: YouMeek: http://www.YouMeek.com YouMeek导航: http://i.YouMeek.com GitHub: https://github.com/ IntelliJ IDEA: http://www.jetbrains.com/idea/
aboutme: 此地只专注于技术
open_in_new: true
rss: /atom.xml
fancybox: true
mathjax: false
share: true
baidu_site: google_site:
google_analytics:
baidu_tongji: b68dade9d355a0b3d875d0ffbbe1f212
visit_counter: on: true site_visit: 本站到访数 page_visit: 本页阅读量
github_widget: false
|
常用页面添加
404、关于我、标签页
- 还是以上一篇文章我们讲解的项目根目录上:E:\git_work_space\hexo,在该目录启动 Git Bash:
- 新增一个 404 页面:
hexo new page 404
- 新增一个 about 页面:
hexo new page about
- 新增一个 tag 标签云页面:
hexo new page tags
- 新增一个 robot.txt 文件,把该文件放在:E:\git_work_space\hexo\source 目录下,如果你没有该文件可以到我的项目上找:https://github.com/judasn/judasn.github.io
- robot 文件内容:
1 2 3 4 5 6 7 8 9 10
| User-Agent: * Allow: / Disallow: /background Disallow: /css Disallow: /fancybox Disallow: /font-awesome Disallow: /img Disallow: /js Sitemap: http://code.youmeek.com/sitemap.xml Sitemap: http://code.youmeek.com/baidusitemap.xml
|
置顶文章方法
- 参考:解决Hexo置顶问题
- 编辑这个文件:
node_modules/hexo-generator-index/lib/generator.js
- 覆盖原文件内容,采用下面内容:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
| 'use strict'; var pagination = require('hexo-pagination'); module.exports = function(locals){ var config = this.config; var posts = locals.posts; posts.data = posts.data.sort(function(a, b) { if(a.top && b.top) { // 两篇文章top都有定义 if(a.top == b.top) return b.date - a.date; // 若top值一样则按照文章日期降序排 else return b.top - a.top; // 否则按照top值降序排 } else if(a.top && !b.top) { // 以下是只有一篇文章top有定义,那么将有top的排在前面(这里用异或操作居然不行233) return -1; } else if(!a.top && b.top) { return 1; } else return b.date - a.date; // 都没定义按照文章日期降序排 }); var paginationDir = config.pagination_dir || 'page'; return pagination('', posts, { perPage: config.index_generator.per_page, layout: ['index', 'archive'], format: paginationDir + '/%d/', data: { __index: true } }); };
|
- 然后在文章头部的:Front-matter 位置加上一个:
top: 1000 的内容。数值越大,越靠前
添加一些不希望被渲染的文件到 hexo
- 因为我们使用的是 Github 项目做空间,所以一般项目我们都要放一个 README.md 文件,而我们希望这个文件不被 hexo 渲染成 HTML 文件,我们需要这样做:
- 把 README.md 放在这个目录下:
hexo\source\README.md
- 编辑这个配置文件:
hexo\_config.yml,找到这个关键字:skip_render,然后这样写:1 2
| skip_render: - README.md
|
- 有时候我们需要排除一整个目录,道理跟上面一样,比如你现在访问:http://code.YouMeek.com/i,你发现会跑到我的一个备份导航中,而我是通过这样配置来实现的:
- 这里的
i 是我的目录名称,因为我的真正导航地址是:http://i.YouMeek.com,所以取这样的目录名字方便记忆。
- 而
i/** 这里的后缀的两个星号表示这个目录下包括子目录,其所有文件都被忽略渲染。
- 对于一些 HTML 和 CSS、JS 这类也要注意,hexo 有一套自己的渲染方式,比如可能会对你的 JS 做一些特殊处理,所以可能会让你的 JS 失效,所以最好按我这种方式来排除掉。
1 2 3
| skip_render: - README.md - i/**
|
插件推荐
插件的基本使用命令
- 插件官网:https://hexo.io/plugins/
- 安装插件:
npm install 插件名 --save
- 卸载插件:
npm uninstall 插件名
- 更新插件和博客框架(需要在 E:\git_work_space\hexo 目录下):
npm update
- 它实质上是通过项目根目录下 package.json 文件更新各大组件
必备插件
- 支持RSS:
npm install hexo-generator-feed --save
- 生成站点地图:
npm install hexo-generator-sitemap --save
- 生成百度站点地图:
npm install hexo-generator-baidu-sitemap --save
- HTML 压缩:
npm install hexo-html-minifier --save
- JavaScript 压缩:
npm install hexo-uglify --save
- CSS 压缩插件:
npm install hexo-clean-css --save
- SEO优化:
npm install hexo-generator-seo-friendly-sitemap --save
- 搜索支持,需要主题有对应的设置:
npm install hexo-generator-search --save
结束语
- 真心希望这是 Hexo 最后一篇,因为我们只是要安心写东西而已,不需要太多折腾。