hexo博客搭建

安装node.js

官网下载地址：https://nodejs.org/en/

win+r 输入 cmd进入命令行，查看node版本

node -v  
npm -v

安装cnpm,使用国内镜像淘宝

npm install -g cnpm --registry=https://registry.npm.taobao.org

安装hexo-cli

cnpm install -g hexo-cli

验证是否安装成功

hexo -v

搭建博客

创建blog文件夹（也可直接右键新建文件夹）,并进入这个目录

mkdir blog
cd blog

初始化博客

hexo init

启动博客(hexo start)

hexo s

访问地址：http://localhost:4000/

发表文章

hexo n "我的第一篇博客文章"

对source_posts\我的第一篇博客文章.md进行修改

清理

hexo clean

生成文章(hex generate)

hexo g

重新开启服务器,输入网址就可以看到发表的文章

hexo s

博客部署到github

登陆github创建一个新仓库

注意：仓库名字：域名.github.io

2.创建成之后,安装hexo-deployer-git

cnpm install --save hexo-deployer-git

3.在blog文件夹下修改_config.yml

修改_config.yml文件末尾的内容

repo里面填写github仓库地址

branch 填写分支

注意：这个仓库地址不可用，不能随便起域名 vip.github.io不行。要用自己的github用户名

用户名.giuthub.io

deploy:
  type: 'git'
  repo: 'https://github.com/dengerpu/dengerpu.github.io.git'
  branch: 'master'

4.部署到远端

hexo d

5.访问

地址:https://vip.github.io

更改后的地址:https://dengerpu.github.io

最后发现vip域名被占用了，就换了个域名重新部署到远端（更改下仓库名，和_config.yml里面的配置，再次部署到远端即可 hexo d）

更改博客主题

地址：https://github.com/litten/hexo-theme-yilia

下载主题

git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

修改_config.yml这个文件

theme: yilia

重新清理，生成

hexo clean
hexo g

重新开启博客服务器

hexo s

推到远端

hexo d

博客常用命令

Create a new post（发表文章）

hexo new "My New Post"

More info: Writing

Run server（运行服务器）

hexo server

More info: Server

Generate static files（发送到服务器）

hexo generate

More info: Generating

Deploy to remote sites（部署到远程站点）

hexo deploy

更换Hexo Fluid主题

参考网址：https://hexo.fluid-dev.com/docs/start/

Hexo 5.0.0 版本以上，推荐通过 npm 直接安装，进入博客目录执行命令：

npm install --save hexo-theme-fluid

然后在博客目录下创建 _config.fluid.yml，将主题的 _config.yml 内容复制过去

地址：https://github.com/fluid-dev/hexo-theme-fluid/blob/master/_config.yml

如下修改 Hexo 博客目录中的 _config.yml：

theme: fluid  # 指定主题

language: zh-CN  # 指定语言，会影响主题显示的语言，按需修改

乱码解决方案：

_config.fluid.yml文件通过vscode打开，设置使用utf-8编码，不过其他注释会乱码。我们再复制之前的覆盖掉这个就可以了。

修改博客文章模板

通过hexo new “文章名称”命令新建博客文章时，默认使用的模板是post.md，该文件在站点根目录的scaffolds文件夹中，修改hexo新建博客的模板一共有两种方法:

①直接修改post.md (推荐)

---
title:  {{ title }}
index_img: 
categories: 分类
tags: [标签1, 标签2]
date: {{ date }}
---

②新建自己的模板。

新建一个名为blog.md的模板（名称可以根据自己的需求随便取，但是不可以与当前的文件夹中的文件重名，也不可以命名为page.md
因为hexo new page “名称”命令是新建一个页面)

如果要新建博客，通过``hexo new blog “文章名称”`命令新建，该命令中的blog字段说明使用的是名为blog.md的模板

展示访问量

https://console.leancloud.cn/apps

先创建应用

创建Class

创建的名称必须是Counter，且要配置无限制，这样才会更新浏览次数，不然接口403，不会更新数据。

配置themes/fluid/_config.yml文件

web_analytics:  # 网页访问统计
  enable: true
  leancloud:
    app_id: 获取的appid
    app_key: 获取的appkey
    server_url: https://ftqzr21d.lc-cn-n1-shared.com

statistics:
   enable: true
   source: "leancloud"
   pv_format: "总访问量 {} 次"
   uv_format: "总访客数 {} 人"

# 浏览量计数
 # Number of visits
 views:
   enable: true
   # 统计数据来源
   # Data Source
   # Options: busuanzi | leancloud
   source: "leancloud"
   format: "{} 次"

配置网站运行时间

themes\fluid\layout_partials\footer.ejs

<footer class="text-center mt-5 py-3">
  
   <% if (theme.footer.content) { %>
    <div class="footer-content">
      <%- theme.footer.content %>
    </div>
  <% } %>
  <!-- 添加网站运行时间 -->
  <div class="footer-content">
    <div>
      <span id="timeDate">载入天数...</span>
      <span id="times">载入时分秒...</span>
      <script>
      var now = new Date();
      function createtime(){
          var grt= new Date("06/18/2022 00:00:00");//此处修改你的建站时间或者网站上线时间
          now.setTime(now.getTime()+250);
          days = (now - grt ) / 1000 / 60 / 60 / 24;
          dnum = Math.floor(days);
          hours = (now - grt ) / 1000 / 60 / 60 - (24 * dnum);
          hnum = Math.floor(hours);
          if(String(hnum).length ==1 ){
              hnum = "0" + hnum;
          }
          minutes = (now - grt ) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum);
          mnum = Math.floor(minutes);
          if(String(mnum).length ==1 ){
                    mnum = "0" + mnum;
          }
          seconds = (now - grt ) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum);
          snum = Math.round(seconds);
          if(String(snum).length ==1 ){
                    snum = "0" + snum;
          }
          document.getElementById("timeDate").innerHTML = "本网站已运行🚀  "+dnum+" 天";  //此次自定义显示内容
          document.getElementById("times").innerHTML = hnum + " 小时 " + mnum + " 分 " + snum + " 秒";
      }  //此次自定义显示内容
      setInterval("createtime()",250);
      </script>
    </div>
  </div>
  <!-- 统计访问量信息 -->
    <% if (theme.footer.statistics.enable) { %>
    <%- partial('_partials/footer/statistics.ejs') %>
  <% } %>
  <% if(theme.footer.beian.enable) { %>
    <!-- 备案信息 ICP for China -->
    <%- partial('_partials/footer/beian.ejs') %>
  <% } %>
  <% if(theme.web_analytics.cnzz) { %>
    <!-- cnzz Analytics Icon -->
    <span id="cnzz_stat_icon_<%= theme.web_analytics.cnzz %>" style="display: none"></span>
  <% } %>
</footer>