书不记,熟读可记;义不精,细思可精;惟有志不立,直是无著力处。——朱熹
我最近在搭建hexo 个人博客,优点是独立属于自己的,但是缺点也很明显,
在主流的搜索引擎几乎无法搜索关于自己的帖子,所以需要自己SEO优化,下面是我的相关操作,希望能够给大家带来帮助。
sitemap 顾名思义,Sitemap 可方便网站管理员通知搜索引擎他们网站上有哪些可供抓取的网页。最简单的 Sitemap形式,就是XML文件,在其中列出网站中的网址以及关于每个网址的其他元数据(上次更新的时间、更改的频率以及相对于网站上其他网址的重要程度为何等),以便搜索引擎可以更加智能地抓取网站。
我们需要下载两个站点插件
npm install hexo-generator-sitemap --save # sitemap.xml
npm install hexo-generator-baidu-sitemap --save # baidu-sitemap.xml
安装完成以后,需要在站点配置文件的_config.xml(注:不是主题配置文件)中添加
# 自动生成sitemap
sitemap:
path: sitemap.xml
baidusitemap:
path: baidusitemap.xml
这样,每次hexo general 都会自动生成配置文件sitemap.xml(google引擎)和 baidu-sitemap.xml(百度引擎)。
seo搜索引擎优化中,网站的最佳结构是用户从首页点击三次就可以到达任何一个页面,但是我们使用hexo编译的站点打开文章的url是:sitename/year/mounth/day/title四层的结构,这样的url结构很不利于seo,爬虫就会经常爬不到我们的文章,于是,我们可以将url直接改成sitename/title的形式,并且title最好是用英文,在根目录的配置文件下修改permalink如下
url: http://你的网站
root: /
permalink: :title.html
permalink_defaults:
重新hexo general后,随便打开一篇日志,url的绝对地址结构就改成 http://yoursite/title.xml 了
User-agent: *
Allow: /
Allow: /home/
Allow: /archives/
Allow: /about/
Disallow: /vendors/
Disallow: /js/
Disallow: /css/
Disallow: /fonts/
Disallow: /vendors/
Disallow: /fancybox/
Sitemap: http://lansus.coding.me/sitemap.xml
Sitemap: http://lansus.coding.me/baidusitemap.xml
Allow表示允许被访问的,Disallow是不允许的意思。注意后面两个Sitemap就是网站地图了。而网站地图前面说了是给爬虫用的。这里配置在robots中。把上面的代码保存为robots.txt放入theme/yourtheme/source 。在编译后这个文件会出现在blog/public中。后面会使用到
下面实对关键词的优化,因为搜索姻亲对关键词也会抓取。
next主题模板文件大部分是swig文件,但是新的大部分主题的layout模板文件是ejs写的,我们在确定主题模板文件是否有对keyword的生成,只要查找theme/yourtheme/layout/_partials\head.文件后缀即可。查找里面是否有theme.keywords
的字段,下面给出next主题的head.swig和hiker主题的head.ejs代码。
# next theme head.swig
{% if page.keywords %}
{% elif page.tags and page.tags.length %}
{% elif theme.keywords %}
{% endif %}
# hiker theme
<% if (page.keywords){ %>
<% } else if (theme.keywords){ %>
上面的代码并不需要只是用来判断keyword是否有生成,下面是需要我们添加的,在 \scaffolds\post.md中:
keywords:
description:
然后就可以在新写的文件里添加keyword,格式是[1,2,3]
#开启压缩文件
因为hexo生成的文件是静态html,里面占用了大量的空白符。使用gulp进行压缩接口提高访问速度并且降低内存。
进行下列操作
npm install [email protected] (gulp 4.0.0以上压缩会对现有hexo文件报错)
npm install gulp-minify-css gulp-uglify gulp-htmlmin gulp-htmlclean gulp --save
npm install gulp-concat
npm install gulp-imagemin
在hexo blog文件夹下创建gulpfile.js:
var gulp = require('gulp'),
uglify = require('gulp-uglify'),
cssmin = require('gulp-minify-css'),
imagemin = require('gulp-imagemin'),
htmlmin = require('gulp-htmlmin'),
htmlclean = require('gulp-htmlclean');
concat = require('gulp-concat');
//JS压缩
gulp.task('uglify', function() {
return gulp.src(['./public/js/**/.js','!./public/js/**/*min.js'])//只是排除min.js文件还是不严谨,一般不会有问题,根据自己博客的修改我的修改为return gulp.src(['./public/**/*.js','!./public/zuoxi/**/*.js',,'!./public/radio/**/*.js'])
.pipe(uglify())
.pipe(gulp.dest('./public/js'));//对应修改为./public即可
});
//public-fancybox-js压缩
gulp.task('fancybox:js', function() {
return gulp.src('./public/vendors/fancybox/source/jquery.fancybox.js')
.pipe(uglify())
.pipe(gulp.dest('./public/vendors/fancybox/source/'));
});
// 合并 JS
gulp.task('jsall', function () {
return gulp.src('./public/**/*.js')
// 压缩后重命名
.pipe(concat('app.js'))
.pipe(gulp.dest('./public'));
});
//public-fancybox-css压缩
gulp.task('fancybox:css', function() {
return gulp.src('./public/vendors/fancybox/source/jquery.fancybox.css')
.pipe(cssmin())
.pipe(gulp.dest('./public/vendors/fancybox/source/'));
});
//CSS压缩
gulp.task('cssmin', function() {
return gulp.src(['./public/css/main.css','!./public/css/*min.css'])
.pipe(cssmin())
.pipe(gulp.dest('./public/css/'));
});
//图片压缩
gulp.task('images', function() {
gulp.src('./public/uploads/*.*')
.pipe(imagemin({
progressive: false
}))
.pipe(gulp.dest('./public/uploads/'));
});
// 压缩 public 目录 html文件 public/**/*.hmtl 表示public下所有文件夹中html,包括当前目录
gulp.task('minify-html', function() {
return gulp.src('./public/**/*.html')
.pipe(htmlclean())
.pipe(htmlmin({
removeComments: true,
minifyJS: true,
minifyCSS: true,
minifyURLs: true,
}))
.pipe(gulp.dest('./public'))
});
gulp.task('build', ['uglify', 'cssmin', 'fancybox:js', 'fancybox:css', 'jsall','images']);
//, 'minify-html'
在根目录下的package.json文件中生成写入scripts:
"scripts": {
"build":"hexo clean && hexo g && gulp build"
}
全文件为:
{
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"hexo": {
"version": "3.8.0"
},
"dependencies": {
"gulp": "^3.9.1",
"gulp-concat": "^2.6.1",
"gulp-htmlclean": "^2.7.22",
"gulp-htmlmin": "^5.0.1",
"gulp-minify-css": "^1.2.4",
"gulp-uglify": "^3.0.2",
"hexo": "^3.8.0",
"hexo-deployer-git": "^1.0.0",
"hexo-generator-archive": "^0.1.5",
"hexo-generator-baidu-sitemap": "^0.1.6",
"hexo-generator-category": "^0.1.3",
"hexo-generator-feed": "^1.2.2",
"hexo-generator-index": "^0.2.1",
"hexo-generator-json-content": "^4.1.3",
"hexo-generator-searchdb": "^1.0.8",
"hexo-generator-sitemap": "^1.2.0",
"hexo-generator-tag": "^0.2.0",
"hexo-renderer-ejs": "^0.3.1",
"hexo-renderer-marked": "^0.3.2",
"hexo-renderer-stylus": "^0.3.3",
"hexo-server": "^0.3.3"
},
"scripts": {
"build":"hexo clean && hexo g && gulp build"
}
}
这样可以用npm run build
一次性搞定 三个操作了,每次打包带时候会生成压缩文件。