您的位置:首页 > 其它

Hexo + Next + valine个人博客 (2)安装Hexo,美化主题

2020-03-27 20:09 531 查看

前言

前面环境已经搭好,开始安装Hexo

下载Hexo

创建一个文件夹,进入并右键点击

Git Bash Here

完整操作

下载

cnpm install hexo-cli -g

初始化

hexo init

测试

hexo s

博客搭建好了
但是会感觉默认的主题太过单调
没关系,可以更改

美化主题

介绍
这里用的是Next

1. Next主题集成了评论、统计等功能,非常强大,也是很火的一个主题

2. 这里有两个_config.xml文件,一个是站点目录下的,是Hexo初始化时的配置;另一个是Next主题下的,位于主题目录下,由主题作者提供

站点目录

/MyBog/_config.xml

主题目录

/MyBlog/themes/next/config.xml

关于博客有几条指令经常用到

hexo clean   #清除缓存
hexo g       #生成静态页面
hexo s       #开启本地服务器
hexo d       #部署到远程服务器
#将hexo clean、hexo g、hexo s统称为测试三连

主题设定

在Git中输入命令下载主题
主题下载可到Themes | Hexo

点击

复制链接

完整操作

git clone https://github.com/iissnan/hexo-theme-next theme/next
  • 打开站点目录 找到theme字段,将值修改为next,如图:

  • 现在测试三连(

    hexo clean 、hexo g 、hexo s
    )运行

完整操作

hexo clean
hexo g
hexo s

并打开

https://localhost:4000
测试

主题版本设定

  • 编辑

    主题配置
    ,可以更改Next中的几种版本主题

  • Muse - 默认 Scheme,这是 NexT 最初的版本,黑白主调,大量留白
    Mist - Muse 的紧凑版本,整洁有序的单栏外观
    Pisces - 双栏 Scheme,小家碧玉似的清新
    Gemini - 新出的版本,简约的风格比较不错(现在我正在用的)

语言设定

编辑

站点配置
,将language设置为想要的语言

语言            代码            示例
1. English     ——   en          ——  language:en
2. 简体中文     ——  zh-Hans      ——  language: zh-Hans
3. 繁体中文     ——  zh-hk        ——  language: zh-hk

菜单设定

编辑

站点配置
,搜索
menu
,将需要的类别取消注释,即
#

新建-关于

完整操作

hexo new page about

新建-标签

完整操作

hexo new page tags

新建-分类

完整操作

hexo new page categories

新建-归档

完整操作

hexo new page archives

并在

主题配置
中修改为true,如图:

效果如图:

文章的标签、分类使用

开启社交

效果如图:

全文阅读

在markdown文章中任意位置添加

<!-- more -->

效果如图:

统计阅读量、人数、字数

编辑

主题目录
中需要的,改为true,统计网站、文章访问的人数

编辑

主题目录
中需要的,改为true,统计字数、阅读时间

效果如图:

返回顶部

编辑

主题目录
,改为true

效果如图:

博客搭建最后效果
https://l1090865.github.io/

END

end

  • 点赞 1
  • 收藏
  • 分享
  • 文章举报
白码王子 发布了3 篇原创文章 · 获赞 1 · 访问量 79 私信 关注
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: