Hexo结合Stun静态博客搭建从入门到入土
摘要
- 安装npm,安装hexo相关依赖,安装主题stun
- 修改hexo配置,修改stun配置,部署到github,gitee实现静态访问
- 给博客加上全局搜索,访问量统计
- hexo博客编写模板
tips: 以下{$xxx}均为用户自定义
搭建环境
创建仓库
1.github
仓库命名为:{$你的ID}.github.io
2.gitee
仓库命名为:
仓库名大小写一致,访问路径也是
环境安装
1.安装npm
2.安装cnpm
npm install cnpm
3.安装博客搭建框架hexo
cnpm install -g hexo-cli
4.新建一个文件夹,并且之后所有操作都基于该文件夹
mkdir {$xxx}
cd {$xxx}
5.安装依赖,下载主题
cnpm install --save hexo-deployer-git
cnpm install --save hexo-render-pug
cnpm install --save hexo-generator-search
git clone https://github.com/liuyib/hexo-theme-stun.git themes/stun
6.增加页面导航
hexo new page categories
hexo new page tags
项目目录/source/categories/index.md 加上
type: categories
项目目录/source/tags/index.md 加上
type: tags
修改配置文件
1.修改部署文件夹下/_config.yml(挑选重要部分修改)
#展示设置
title: {$自定义文字}
language: zh-CN
url: {$博客地址}
#主题
theme: stun
#git相关
deploy:
type: git
repo:
github: {$你的博客仓库}
gitee: {$你的博客仓库}
branch: master
#搜索相关
search:
path: search.json
field: post
content: true
2.修改部署文件夹下/themes/stun/_config.yml(挑选重要部分修改)
#取消导航栏注释(注意空格对齐)
menu:
categories: /categories/ || fas fa-layer-group
tags: /tags/ || fas fa-tags
#更改图标(最好使用链接地址,我这里使用的图床,图床使用见下一篇博客)
favicon:
small: https://gitee.com/BothSavage/PicGo/raw/master/image/favicon-16x16.png
medium: https://gitee.com/BothSavage/PicGo/raw/master/image/favicon-32x32.png
#更改背景大图
header:
bg_image:
enable: true
url: https://gitee.com/BothSavage/PicGo/raw/master/image/背景.png
#更改头像大图,并设为圆形
author:
avatar:
url: https://gitee.com/BothSavage/PicGo/raw/master/image/头像.png
rounded: true
#打开访问统计
busuanzi:
enable: true
#打开搜索功能
local_search:
enable: true
运行
1.基础命令
hexo c #清理一下
hexo g #生成
hexo s #部署到本地4000端口
hexo d #部署到远程Github仓库
2.推荐命令
#第一次尝试本地是否能访问
hexo c && hexo g && hexo s
#以后每次添加文章
hexo c && hexo g && hexo d
博客文件存放地点
项目目录/source/_posts
markdown文件规范
1.文章元数据
#分别指定文章标题,时间,类别,标签
---
title: Hexo结合Stun静态博客搭建从入门到入土
date: 2020-12-19 20:40:11
categories:
- 杂项
tags:
- 前端
- 建站
---
2.主页不显示文章全部
上面是显示内容
<!--more-->
其他高级功能
stun主题支持
- 评论系统
- 站长工具
- 数据公式
- 网站特效
- ................
详情请查看
https://theme-stun.github.io/docs/zh-CN/
参考
[1].菜鸟教程:NodeJS安装配置
[2].Stun主题指南
[3].静态博客搭建
[4]._more截断文章_多标签添加
[5].在gitee上部署静态网站(或者个人博客)
本文作者: Both Savage
本文链接: https://bothsavage.github.io/2020/12/19/%E6%9D%82%E9%A1%B9/Hexo%E7%BB%93%E5%90%88Stun%E9%9D%99%E6%80%81%E5%8D%9A%E5%AE%A2%E6%90%AD%E5%BB%BA%E4%BB%8E%E5%85%A5%E9%97%A8%E5%88%B0%E5%85%A5%E5%9C%9F/
版权声明: 本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!