笑一笑世界真美妙

0%

Hexo个人配置汇总和next皮肤设置

发表于 更新于 分类于
本文字数： 4.5k 阅读时长 ≈ 4 分钟

个人的hexo博客配置汇总，便于记忆和查阅，对备份、迁移、升级或许会有帮助。

进入到博客文件夹里面就有hexo的相关文件，其中_config.yml统称为站点配置文件。

而皮肤下的_config.yml统称为皮肤配置文件。

网站个性化、语言和时区等

站点配置文件

1
2
3
4
5
6
7
8
# Site
title: Hexo
subtitle: ''
description: ''
keywords:
author: John Doe
language: zh-CN
timezone: 'Asia/ShangHai'

url 网址设置

1
2
3
4
url: http://yoursite.com
root: /
permalink: :category/:year:month:day-:urlname/ #:year/:month/:day/:title/
permalink_defaults:

permalink是设置永久链接，采用文章中Front-matter定义的一个变量

如urlname: synology-build_hexo-blog

主题

我选择的是next主题

大多数情况下稳定。推荐给初学者。

1
2
mkdir themes/next
curl -s https://api.github.com/repos/theme-next/hexo-theme-next/releases/latest | grep tarball_url | cut -d '"' -f 4 | wget -i - -O- | tar -zx -C themes/next --strip-components=1

可能不稳定，但包含最新功能。推荐给高级用户和开发人员。

  • 通过curl & tar安装:
1
2
mkdir themes/next
curl -L https://api.github.com/repos/theme-next/hexo-theme-next/tarball | tar -zxv -C themes/next --strip-components=1
- 通过git安装： 
1
git clone https://github.com/theme-next/hexo-theme-next themes/next

Hexo选择主题

修改站点配置文件，默认是landscape。

1
theme: next

next主题设置

查看另一篇文章Hexo的Next主题美化设置

SEO设置

主要是百度和谷歌。

站点地图

安装站点地图插件：

1
2
npm install hexo-generator-sitemap --save
npm install hexo-generator-baidu-sitemap --save

在站点配置文件下添加：

1
2
3
4
5
# sitemap config
sitemap: 
  path: sitemap.xml
baidusitemap:
  path: baidusitemap.xml

百度SEO设置

待更新

谷歌SEO设置

简要说明下流程。

谷歌网址所有权验证

我使用的是HTML 标记，把谷歌提供的标记添加到头部。

位置是themes/next/layout/_partials/head/head.swig，在前面的地方添加：

1
2
3
4
5
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=2">
<meta name="theme-color" content="{{ theme.android_chrome_color }}">
<meta name="generator" content="Hexo {{ hexo_version }}">
<meta name="google-site-verification" content=谷歌提供的标记 />

关联github

  1. 安装hexo-deployer-git

    1
    npm install hexo-deployer-git --save

  2. 修改配置文件

    1
    2
    3
    4
    deploy:
      type: git
      repo: https://github.com/<username>/<project>
      branch: master

  3. 配置Git邮箱和用户名

    1
    2
    git config --global user.email "you@example.com"
    git config --global user.name "Your Name"

  4. 如果使用域名绑定github，需要在/source目录下建立CHAME文件，不能后后缀，里面只写入一个域名，没有http://和https://前缀。

添加评论

用的是next主题自带gitalk评论的配置，打开主题配置文件，搜索comments，在gitalk位置添加相关的内容：

1
2
3
4
5
6
7
8
9
10
11
12
gitalk:
  enable: true
  github_id: # GitHub repo owner
  repo: # Repository name to store issues
  client_id: # GitHub Application Client ID
  client_secret: # GitHub Application Client Secret
  admin_user: # GitHub repo owner and collaborators, only these guys can initialize gitHub issues
  distraction_free_mode: true # Facebook-like distraction free mode
  # Gitalk's display language depends on user's browser or system environment
  # If you want everyone visiting your site to see a uniform language, you can set a force language value
  # Available values: en | es-ES | fr | ru | zh-CN | zh-TW
  language: zh-CN

添加豆瓣电影

安装插件hexo-douban

1
npm install hexo-douban --save

添加站点配置文件代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
#添加豆瓣电影
douban:
  user: mythsman
  builtin: false
  #book:
    #title: 'This is my book title'
    #quote: 'This is my book quote'
  movie:
    title: 'This is my movie title'
    quote: 'This is my movie quote'
  #game:
    #title: 'This is my game title'
    #quote: 'This is my game quote'
  timeout: 10000

如果只想生成某一个页面（比如只生成电影页面），把其他的配置项注释掉即可。

user: 填写豆瓣 ID。登陆豆瓣后点击个人主页，此时 url 中最后一段即是用户 ID，一般情况下会是一段数字，如果设置了个人域名的话，则个人域名即为 ID。
builtin: 是否将生成页面的功能嵌入 hexo s 和 hexo g 中。
timeout: 爬取数据的超时时间。

配置首页显示

修改next皮肤配置文件，搜索menu:

添加需要的豆瓣内容：

1
2
3
4
5
6
7
8
9
10
11
12
13
menu:
  home: / || home
  #about: /about/ || user
  tags: /tags/ || tags
  categories: /categories/ || th
  archives: /archives/ || archive
  #schedule: /schedule/ || calendar
  #sitemap: /sitemap.xml || sitemap
  #commonweal: /404/ || heartbeat
  #以下是豆瓣
  #Books: /books     || books
  movies: /movies   || movie
  #Games: /games   || games

修改首页菜单显示为中文，修改next主题语言文件themes\next\language\zh_CN.yml

1
2
3
4
5
6
7
8
menu:
    home: 首页
    archives: 归档
    categories: 分类
    tags: 标签
    movies: 电影
    books: 读书
    games: 游戏

写作模板

/scaffolds/post.md

1
2
3
4
5
6
title: {{ title }}
date: {{ date }}
urlname:
tags:
categories:
description:

去除代码块的行号

在站点配置文件中找到 highlight 节点，设置 line_number 为 false

文章图片可点击放大

需要插件fancybox3支持，安装在主题next里。

1
2
cd themes/next
git clone https://github.com/theme-next/theme-next-fancybox3 source/lib/fancybox

主题配置文件修改：

1
2
3
# FancyBox is a tool that offers a nice and elegant way to add zooming functionality for images.
# For more information: https://fancyapps.com/fancybox
fancybox: true
您的支持是我最大动力