使用Hexo来创建个人博客

发表于 | 分类于 | 阅读次数:
字数统计: 3k | 阅读时长 ≈ 0:03

安装Hexo

1.安装Git

1
$ sudo apt-get install git-core

2.安装node.js

  • 首先安装nvm

    1
    $ curl https://raw.github.com/creationix/nvm/master/install.sh | sh

  • 通过nvm安装node.js (注意版本一定要是0.10以上)

    1
    $ nvm install 0.10

3.安装使用hexo

  • 安装hexo

    1
    $ npm install -g hexo

  • 初始化

    1
    $ hexo init <folder>

配置Hexo

1.申请账号并获取jiathis和友言的嵌入代码
去加网申请一个账号
友言
这个账号可以供友言和jiathis使用

2.添加友言
在_config.yml文件中添加

1
2
3
#友言
uyan:
  enable: true

在themes/light/layout/_partial/comment.ejs中将其修改为如下所示

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<% if (config.disqus_shortname && page.comments){ %>
<section id="comment">
  <h1 class="title"><%= __('comment') %></h1>
  <div id="disqus_thread">
    <noscript>Please enable JavaScript to view the <a href="//disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
  </div>
</section>
<% } %>

<% if (config.uyan.enable && page.comments){ %>

<section id="comment">
  <h1 class="title"><%= __('comment') %></h1>
  <div id="disqus_thread">
    <!-- UY BEGIN -->
    <div id="uyan_frame"></div>
    <script type="text/javascript" src="http://v2.uyan.cc/code/uyan.js?uid=你的id"></script>
    <!-- UY END -->
  </div>
</section>

<% } %>

3.添加分享
在themes/light/_config.yml文件中添加

1
2
jiathis:
  enable: true

在themes/light/layout/_partial/post/share.ejs中将其修改为如下所示

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<% if (theme.addthis.enable){ %>
  <div class="addthis addthis_toolbox addthis_default_style">
    <% if (theme.addthis.facebook){ %>
      <a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
    <% } %>
    <% if (theme.addthis.twitter){ %>
      <a class="addthis_button_tweet"></a>
    <% } %>
    <% if (theme.addthis.google){ %>
      <a class="addthis_button_google_plusone" g:plusone:size="medium"></a>
    <% } %>
    <% if (theme.addthis.pinterest){ %>
      <a class="addthis_button_pinterest_pinit" pi:pinit:layout="horizontal"></a>
    <% } %>
    <a class="addthis_counter addthis_pill_style"></a>
  </div>
  <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js<% if (theme.addthis.pubid){ %>#pubid=<%= theme.addthis.pubid %><% } %>"></script>
<% } %>

<% if (theme.jiathis.enable){ %>
<!-- JiaThis Button BEGIN -->
你在jiathis获得的代码
<!-- UJian Button END -->
<% } %>

4.添加新浪微博展示widget
到新浪微博的微博秀里获得微博秀的代码
在themes/light/layout/_widget下创建weibo.ejs文件并添加

1
2
3
<div class="widget tag">
你在新浪微博的微博秀中生成的代码
</div>

编写博客

新键一篇博客

1
$ hexo new post "your article title"

可以到source/_posts/下去找到刚新建的博客进行编辑

发布到github

-执行hexo generate生成html
-执行hexo deploy发布到github
发布之前先去到_config.yml文件中去设定你的github地址

1
2
3
deploy:
  type: github
  repository: https://github.com/你的github账号名/你的github账号名.github.com.git

0%