hexo搭建博客以及美化一

1 hexo搭建

１　先说一下我的搭建的一些信息

我的操作系统是ubuntu18.04　在这之上搭建的

至于windows系统，我没搭建过所以不知道　可以参考

2 安装hexo

1 安装git 这个我就不说了太简单了 git –version

2 安装node js

sudo tar -xJf node-v6.11.2-linux-x64.tar.xz -C /usr/local

sudo ln -s /usr/local/node-v6.11.2-linux-x64/bin/node /usr/bin/node

sudo ln -s /usr/local/node-v6.11.2-linux-x64/bin/npm /usr/bin/npm

node  -v    npm -v

3 安装hexo

安装hexo:
    sudo npm install -g hexo

在.bashrc　那么我的是在.zshrc中配置hexo的环境变量:
    export PATH=/usr/local/node-v6.11.2-linux-x64/lib/node_modules/hexo/bin:$PATH

初始化博客目录:
    我的是在家目录下　hexo init

解释一下各个文件或者目录:
    node_modules：是依赖包
    public：存放的是生成的页面
    scaffolds：命令生成文章等的模板
    source：用命令创建的各种文章
    themes：主题
    _config.yml：整个博客的配置
    db.json：source解析所得到的
    package.json：项目所需模块项目的配置信息

3　目前只是简单配置next主题 因为我用的就是这个主题

hexo初始化之后默认的主题是landscape

在家目录下的themes目录中:
    cd themes/next
    git clone https://github.com/iissnan/hexo-theme-next

更新主题NexT:
    cd themes/next
    git pull    

切换成NexT主题，在hexo根文件夹下，
编辑_config.yml文件    这个是站点配置文件:
    修改为：　theme: next

切换后，用命令清除下缓存:
    hexo clean

执行hexo s本地产看NexT主题效果:
    hexo s

切换主题 cd blog/themes/next
    vim _config.yaml    这个是主题配置文件

    在列表中选择一款自己喜欢的主题风格。
    # Schemes
    scheme: Muse  //默认主题
    #scheme: Mist
    #scheme: Pisces
    #scheme: Gemini    

    我是这个主题风格：scheme: Gemini

设置Menu:
    默认只有两个首页和归档

    如果还要添加，编辑themes/next/_config.yml：

    menu:
          home: / || home         //首页
          about: /about/ || user    //关于
          tags: /tags/ || tags        //标签
          categories: /categories/ || th    //分类
          archives: /archives/ || archive    //归档
         sitemap: /sitemap.xml || sitemap    //站点地图
         commonweal: /404/ || heartbeat    //404页面

    没有创建Menu对应的文件夹，Blog/source文件目录中只有_post目录

    初始化对应的Menu文件夹:
        比如要创建标签文件夹，终端中输入（前提在Hexo文件路径下）：
            hexo new page "tags"
            hexo new page "about"
            hexo new page "categories"
            hexo new page "archives"

        成功之后在blog/source目录就有tags     about        categories archives 等目录

        编辑Blog/source/tags中index.md文件，添加type: "tags"，其他Menu也同理创建。
        ---
        title: 标签
        date: 2017-07-13 11:16:00
        type: "tags"
        comments: false
        ---

        ---
        title: 分类
        date: 2017-07-13 11:17:07
        type: "categories"
        comments: false
        ---

ok 到目前为止hexo next主题的基本配置就ｏｋ了 下面就是对页面的各种优化

主题配置文件：　blog/themes/next/_config.yaml
站点配置文件：　blog/_config.yam

4 设置动态背景

主题配置文件中找到canvas_nest，设置成ture就OK啦。

# Canvas-nest
canvas_nest: ture

5 在右上角或者左上角实现fork me on github

在GitHub Ribbons或GitHub Corners选择一款你喜欢的挂饰，拷贝方框内的代码：

将刚刚复制的挂饰代码，添加到Blog/themes/next/layout/_layout.swig文件中，添加位置如下图所示(放在<div class="headband"></div>下方)：

<a href="https://github.com/shuigedeng"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_orange_ff7600.png" alt="Fork me on GitHub"></a

6 添加RSS

切换到Blog文件夹（hexo init的文件夹）下

安装Hexo插件
    npm install --save hexo-generator-feed

安装成功之后，编辑Blog/_config.yml文件，在文件末尾添加
    # Extensions
    ## Plugins: http://hexo.io/plugins/
    plugins: hexo-generate-feed    

配置主题_config.yml文件，command+f搜索rss，在后面加上/atom.xml
    # Set rss to false to disable feed link.
    # Leave rss as empty to use site's feed link.
    # Set rss to specific value if you have burned your feed already.
    rss: /atom.xml //注意：有一个空格

hexo s  查看效果    
    

7 在文章末尾添加“文章结束”标记