关于我是如何创建这个博客网站的一些笔记

框架: hexo

域名: 免费域名

托管网站: github.io

基础配置

在 xx 文件夹里 打开 powershell
输入 hexo init yy // yy 是用来存放 hexo 的所有东西, 包括与 npm 有关的拓展, 写好的 md 文件, 编译好的网站文件
第一次的话需要在 yy 文件夹中 安装 npm: npm install

新建文章: 
在 yy 文件夹中新建文章: hexo new 文章名, 文章存放在 source/_posts 中
编辑好后, 在 yy 文件夹里: hexo g, 进行编译, 最后生成的文件在 yy/public 中
					  每次编译前记得 hexo clean 一下, 以防遇到神奇bug
					  hexo s, 进行本地测试
最后把 public 的东西丢到服务器中

github设置

登录 github 后 New repository
命名规则一般是 你的 github id.github.io, github id 也可以换成其他你喜欢的 id

根目录下 _config.yml 的设置:
deploy:
  type: git
  repo: 新建的 repository 的地址
  branch: master

关于 github.io 的空间问题, 官方说没有限制大小, 但建议1G

不过我们写博客嘛, 只要不是一大堆图片, 1G完全够用了. 或者图片放网上, 通过链接引用就可以了嘛

设置 DNS 时的问题 ( 自动好的 , 就是这么迷)

1	Hostname/IP doesn't match certificate's altnames

algolia 配置问题

配置 algolia 时出现：
ERROR [Algolia] Please set an `HEXO_ALGOLIA_INDEXING_KEY` environment variable to enable content indexing.
ERROR >> Read https://npmjs.com/hexo-algolia#api-key for more informations.

一定要用 git bash 配置: export HEXO_ALGOLIA_INDEXING_KEY=你的API Key

插入图片

在主页配置文件 _config.yml 中将 post_asset_folder: 值改为 true
在 hexo 目录中执行:

1	npm install hexo-asset-image --save

现在运行 hexo n xxx 会在生成 xxx.md 的同时生成一个同名的文件夹
将图片放入 xxx 文件夹中, 然后再 xxx.md 中按照 markdown 的格式引入图片即可:

1	![文字说明](xxx/图片名.jpg)

最后检查一下, hexo g 生成页面后, 进入 public\年\月\日\xxx\index.html 中检查

<!--正确语句-->
<img src="年/月/日/xxx/图片名.jpg">
<!--错误语句-->
<img src="xxx/图片名.jpg">

其实因为我是用 Typora 所以第四步可以换成如下:

首先设置 Typora: 偏好设置->图片插入->复制图片到./${filename}.asset文件夹
将文件夹的 .asset 删掉, 图片路径的 .asset也删掉

TODO:

如果能直接设置复制图片到./${filename}就很ok了

插入音乐

这里只介绍如何在文章内插入音乐

音乐来源: 网易云音乐

打开网易云音乐==网站==
点开你喜欢的那首歌
在播放页面的那张转动的唱片下有个 “生成外链播放器”, 点击进入

怎么突然全都版权保护, 无法生成……

还好, 我最爱的能生成

复制这段代码, 直接粘贴到要放这首歌的 md 文件中

4. hexo clean 5. hexo g -d 6. 欣赏你喜欢的音乐

[转]添加评论: Disqus

为 Hexo 博客加入 Disqus 评论

Disqus 官网

配置 Disqus

1
2
3

进入官网并注册后, 点击 GET STARTED->I want to install Disqus on my site
	Website Name: 随便起名, 但会检测唯一性, 且不可更改. 其他随意->Configure Disqus
Website URL: 博客地址, Description: 可不写->Complete Setup

配置 Hexo

根目录下的 _config.yml 新增:
disqus_shortname: 刚才随便起的那个名
由于我用的是 next 主题, 只要在 next 的 _config.yml 里找到
	disqus:
		enable: true
		shortname: 刚才随便起的那个名
		count: true
最后 hexo clean
     hexo g -d

设置标签 & 分类 & 关于[转]

Hexo使用攻略-添加分类及标签

文章添加标签及分类

tags:
	- tag1
	- tag2
categories:
	- category

每篇文章可以由多个标签, 但只能由一个分类

配置新建文章的默认样式

修改 ~/scaffolds/post.md

title: {{ title }} //标题
date: {{ date }} //创建日期
tags: //标签
categories: //分类
update: {{ date }} //更新日期

设置首页不显示全文

只需要在显示的内容的下一行加一句:

置顶文章 [转]

Hexo置顶及排序问题

修改根目录/node_modules/hexo-generator-index/lib/generator.js

'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
    }
  });
};

给需要指定的文章加入 top 参数:

top: x

如果存在多个置顶文章, x 越大, 越靠前

让谷歌爬我的博客 [转]

让Google搜索到搭建在Github Pages上的博客

检查博客是否已被收录: 在谷歌搜索 site:http(s)://博客地址 , 如果有, 那么恭喜你, 如果没有, 那请往下看

进入 Google Search Console

登录后根据说明下载那个 HTML 文件, 把这份文件上传到网站中( 我是托管到 github.io, 所以直接在那里上传即可 )

接着安装插件: _npm install hexo-generator-sitemap --save_

根目录的 _config.yml 设置:\#disqus 评论插件

	disqus_shortname: fm7077

在 Google Search Console 中 _抓取->站点地图 ->添加/测试站点地图->选择"sitemap.xml"_

完成, 接下来耐心等待谷歌更新检索即可

还有许许多多的内容, 未来慢慢补充慢慢写, hexo 真是一个好东西~

各位晚安

一颗牛肉丸

如何创建一个属于自己的博客