导语

为搭建Hexo博客,踩了不少的坑,终究是搭建成功了,记录一下.

之前买过香港主机,用wp建站,试过之后时不时会挂掉,咨询空间商,告诉说是主机IP受到大规模DDOS攻击,导致不能访问,往复几次,遂放弃.转向Github, 使用Github搭建博客也有好处,最直接的一点就是免费.话不多说,开始记录.

Mac上搭建基于GitHub的Hexo博客可分5步:

1. 搭建Github仓库及域名解析;
2. Hexo关联Github;
3. 安装主题theme;
4. 绑定个人域名;
5. 创建并发布博客文章;

一 搭建Github仓库及域名解析

1. 创建Github账号(Github官网),一定要验证邮箱(验证邮箱)
   (这是我新注册的Github账号 用户名:ceshiblog 密码:y******84 邮箱:134****978@qq.com )
2. 登录Github,右上角点+按钮,创建仓库New repository
   
3. 进入Create a new repository页面,
   • ①输入Repository name,要注意格式:你的github用户名.github.io,比如:ceshiblog.github.io
   • ②输入Description描述,比如个人博客,对于描述随意填,也可以什么都不填,后面是可以改的,
   • ③选择public
   • ④点击 Create repository
     
4. 进入仓库页面 (我的仓库页面) ,点击setting
   

5. 向下滚动,点击Change theme(设置主题),在选择主题页面,随意选个就行
   

6. 主题选好后,稍等一分钟,等主题渲染完成,仓库建好了,对应的网站也就建好了 (https://ceshiblog.github.io)
   

7. 绑定个人域名(关于域名的购买,自行百度,其实非常简单)(这一步可不做,就直接使用Github的二级域名就行)

   • 在你创建完成Github仓库时,你就拥有了一个免费的Github二级域名,但现在我们不想通过这个二级域名https://ceshiblog.github.io去访问个人博客,而是想通过个人域名来访问自己的博客,比如作者的个人域名 http://wxyass.com
   • 下面详细步骤
     • ① 进入仓库页面的设置(Settings)选项卡(作者的仓库页面 )
     • ② 往下滑动,找到域名卡片(Custom domain),输入购买的域名(ceshiblog.xyz是作者在阿里云买的域名,第一年¥1元,续费每年¥69元,不续费不能用),然后保存
       
     • ③ 保存成功的显示: Custom domain “ceshiblog.xyz” saved
       
     • ④ 到域名商那里去域名解析(域名在哪里买的就到哪里去解析,作者去的是阿里云)

       名词解释:
           域名解析: 通过域名查找IP地址并访问空间的过程叫做域名解析.  
            CNAME: 如果将域名指向一个域名，实现与被指向域名相同的访问效果，需要增加CNAME记录.  
               @ : 将域名解析为example.com（不带www），填写@或者不填写；  
             www : 将域名解析为www.example.com，填写www； 
       

       

     • ⑤ 等待10分钟解析完成,就可以通过个人域名(http://ceshiblog.xyz)访问博客网站了
8. 此时网站已经建好,个人域名也绑定完毕,现在手动备份一份代码(若没绑定个人域名,这一步可不做)
   因为在后面使用Hexo框架搭建博客时,初次部署会将个人域名覆盖掉,这里备份一下,后面重新上传就可以了
   打开仓库页面(作者的仓库页面 ),
   点击右侧绿底Clone or download,点击download zip,将代码下载到本地电脑(有3个文件,CNAME _config.yml index.md),主要是CNAME文件,保存即可.
9. 建站整理
   仓库页面 : https://github.com/ceshiblog/ceshiblog.github.io 账号密码:github的登录账号
   个人博客: https://ceshiblog.github.io(这是Github提供的免费二级域名) 或 http://ceshiblog.xyz(这是个人购买的域名,收费)

以上是Github仓库的搭建,接下来是Hexo框架的使用,对于新手来说发布博客的操作越简单越好.
而作者觉得使用hexo写博客就很简单,请往下看

二 Hexo关联Github

上面成功搭建Github仓库, 接下来这一块主要讲: 在本地Mac上搭建Hexo环境,并关联Github.

简单说: 通过Hexo在本地生成博客内容,再由hexo将内容提交的github上,最终形成相关博客

Hexo 是一个快速、简洁且高效的博客框架. Hexo官网文档
安装Hexo必须有两个先决条件
1. Node.js的安装
2. git的安装

2.1 下载Node.js和git并安装

2.2 安装Hexo,在mac终端命令行依次执行下面命令

2.3 初始化Hexo本地文件夹,在mac终端命令行依次执行下面命令

此时, 浏览器中打开网址http://localhost:4000，能看到如下页面:

到这里本地hexo环境基本设置好了,可以去关联Github了
另外:按照2.3可以在本地初始化多个Hexo文件夹,当然创建多了也没啥用:

2.5 打开刚刚创建的本地Hexo文件夹(作者打开的的是work/Blog/yassblog.xyz).

2.6 找到_config.yml文件,用sublime Text打开(许多文本工具都能打开这个文件,也可以用命令vim打开)

2.7 打开后往下滑到最后，最下面3行补充修改成如下的样子:(最好手敲,不要copy,因为一些空格在复制时可能会被删除而导致后面的操作报错)

注意: type: repository: branch:这三个单词冒号后面的都有空格,实际_config.yml文件中的冒号后面都有空格

关于里面的repository后面要替换成自己的网址,去你的github仓库页面就能找到

2.8 通过终端命令进入本地Hexo文件夹(作者的是 $ cd work/Blog/yassblog.xyz)

2.9 执行生成静态页面命令 $ hexo generate

成功的显示界面:

① 若报错 
    -bash: $: command not found 
 应对执行
         报错原因: 命令打错了或未安装Node.js 或未安装git 或未安装Hexo(参考作者上面内容 去下载安装)
         安装完成后重新执行 $ hexo g
②若报错 
    ERROR Local hexo not found in ~/blog
    ERROR Try runing: 'npm install hexo —save’
 应对执行
         $ npm install hexo --save  
         重新执行 $ hexo g

2.10 再执行配置命令 $ hexo deploy

①若报错 
    ERROR Deployer not found: git
 应对执行
         $ npm install hexo-deployer-git --save
         重新执行 $ hexo d
②若报错 
    FATAL remote: Permission to yassblog/yassblog.github.io.git denied to ywmblog.  
应对
         打开钥匙串访问(应用程序—>实用工具—>钥匙串访问)
         左下方点击所有项目,右上方搜索 github.com  
         右击 github.com 后面不带括号的这条 删除该条记录
         然后重新执行 $ hexo d

③接②若运行如下 
    INFO  Deploying: git
    INFO  Clearing .deploy_git folder...
    INFO  Copying files from public folder...
    On branch master
    nothing to commit, working tree clean
    Username for 'https://github.com': 
 应对执行
         Username for 'https://github.com':xxx            #输入xxx 你的github用户名
         Password for 'https://yassblog@github.com':xxxx  #输入xxxx 你的github密码 
    回车后需等待一段时间,成功显示如下

③若报错 
    Please tell me who you are
 应对执行
         $ git config --global user.email “108***960@qq.com”    
         $ git config --global user.name “yassblog”                    

         其中: 108***960@qq.com  替换你的github邮箱(注意英文""标点)
               yassblog          替换你的github用户名(注意英文""标点)
         重新执行 $ hexo d

2.11 若你未关联Github，则执行$ hexo d命令时终端会提示你输入Github的用户名和密码

Username for 'https://github.com':xxx              xxx是你的github用户名
Password for 'https://yassblog@github.com':xxxx    xxxx是你的github密码 回车后需等待一段时间  

2.12 还可能让你输入管理员密码(mac登录密码),输入即可 (若没有要求输入密码则忽略这条)

2.13 命令$ hexo d执行成功后，浏览器中打开Github二级域名https://yassblog.github.io（将yassblog换成你的用户名) ,能看到和打开http://localhost:4000时一样的页面。

到这里Hexo关联Github就完成了,接下来就是通过在本地电脑创建博客内容,再通过Hexo上传到Github远程站点上,这样博客网站的搭建基本完成,可能有人会问我在搭建仓库时,已经关联了个人域名,现在输入个人域名为什么打不开网页了, 而只能通过Github的二级域名https://yassblog.github.io 来访问博客,请先别着急,接着往下看,后面的后面会讲到的.

三 安装主题theme

上面分别完成了仓库搭建,Hexo关联Github,接下来的三,四节可跳过的,这两节主要用来美化的.

关于Hexo主题 ,网上已经有很多好看且成熟的成品, 你也可以到Hexo官方主题页搜索.
作者用的是Next主题 Next主题安装文档.

安装备注: http://blog.csdn.net/zuoziji416/article/details/53204478

安装后,主题效果: next作者的博客 , 其中有评论,有分享,有阅读统计,非常实用.

四 绑定个人域名

若不想通过Github的二级域名https://yassblog.github.io来访问个人博客网站,而是希望通过自己的域名(如:http://yassblog.xyz)来访问,作如下操作:

1. 找到之前1.8保存下来的代码(详情请看最上方第一节)
2. 复制CNAME文件到本地Hexo文件夹/public/中(若没有public文件夹,先执行下一步,再执行这步)
3. 终端cd到本地Hexo文件夹(作者的是 $ cd work/Blog/yassblog.xyz)后,依次执行下面3行命令:

   $ hexo g
   $ hexo d
   

4. 到域名商那里,去域名解析(在第一节已经做了)
5. 现在可以用个人域名访问博客了 比如作者的博客http://wxyass.com
6. 可能执行命令去部署时,会有延迟,导致页面打不开,稍等会刷新就好了.

五 创建并发布博客文章

通过上面几步操作,博客网站已经搭建好了, 通过重复下面操作就可以源源不断的发布博客了

1. 打开终端,通过终端命令进入本地Hexo文件夹(作者的是 $ cd work/Blog/yassblog.xyz)

2. 执行如下命令新建文章：
   $ hexo new "Hello Hexo"
   文件名称为Hello Hexo.md的文件会建在目录/yassblog.xyz/source/_posts下。此时,你可以关闭终端命令行, 用Typora软件(或者Mou或者macdown等软件)打开Hello Hexo.md进行编辑.

3. 文章编辑完成保存后，打开终端,终端cd到yassblog.xyz文件夹下，依次执行如下命令来发布：

   $ hexo g  
   $ hexo d  
   

4. 至此，创建并发布一篇博客就完成了.
   稍等会文章真正部署到远程站点上, 你就可以用个人域名访问博客了

PS :

如何全文阅读?
    在文章的适当位置添加 <!--more-->
如何代码高亮?
    主题配置文件_config.yml中修改
           highlight_theme: night blue
使用的图床?
    七牛云

六 结束语

博客终于搭建完成了