Hexo結合Stun靜態部落格搭建從入門到入土
- 2020 年 12 月 19 日
- 筆記
摘要
- 安裝npm，安裝hexo相關依賴，安裝主題stun
- 修改hexo配置，修改stun配置，部署到github，gitee實現靜態訪問
- 給部落格加上全局搜索，訪問量統計
- hexo部落格編寫模板
tips: 以下{$xxx}均為用戶自定義
搭建環境
創建倉庫
1.github
倉庫命名為：{$你的ID}.github.io
2.gitee
倉庫命名為：{$你的ID}
倉庫名大小寫一致，訪問路徑也是
環境安裝
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 //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: //gitee.com/BothSavage/PicGo/raw/master/image/favicon-16x16.png
medium: //gitee.com/BothSavage/PicGo/raw/master/image/favicon-32x32.png
#更改背景大圖
header:
bg_image:
enable: true
url: //gitee.com/BothSavage/PicGo/raw/master/image/背景.png
#更改頭像大圖，並設為圓形
author:
avatar:
url: //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主題支援
- 評論系統
- 站長工具
- 數據公式
- 網站特效
- …………….
詳情請查看
//theme-stun.github.io/docs/zh-CN/
參考
[1].菜鳥教程：NodeJS安裝配置
[2].Stun主題指南
[3].靜態部落格搭建
[4]._more截斷文章_多標籤添加
[5].在gitee上部署靜態網站（或者個人部落格）
本文作者: Both Savage
本文鏈接: //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 許可協議。轉載請註明出處！
