Github+Hexo使用NexT主题和优化

封面:NexT主题网站

作者:熊丶小伍
时间:2019.01.06
来源:xiaowu5759,著作权归作者所有。
链接:https://xiaowu-5759.github.io/2019/02/26/3/

目录

  1. 安装启用NexT主题
  2. NexT主题的设置
  3. 相关的优化

引要

在利用Github Pages和Hexo搭建出拥有自己域名的博客。现在就来看看如何,美化和使用我们的个人博客。这里笔者使用的是比较简约的NexT主题,当然Hexo有很多其他主题,但是修改内容都是差不多的,大家可以积极探索。

正文

[搭建博客],hexo

安装启用NexT主题


  1. 安装NexT
    在博客文件夹中鼠标右键,点击Git Base Here。
    输入命令:
    git clone https://github.com/theme-next/hexo-theme-next themes/next

  2. 启用主题,在站点目录(blog)中,打开配置文件_config.yml,修改theme: next
  3. 验证主题,端口号要是被占用,就先修改端口号,然后启动服务

如果出现如上界面,就说明成功安装了NexT主题。

NexT主题的设置


主题设定

在next主题目录下的_config.yml文件中将scheme设定为Pisces

语言设定和标题设置

在站点根目录下修改配置文件_config.yml文件language为zh-Hans(简体中文)

修改菜单项

主题目录下修改配置文件_config.yml中的menu,增添一个something(注:千万不要在这设置中文,后面的值那是查找文件的地方!若你的站点运行在子目录中,请将链接前缀的/去掉)

这些配置都要与你主题目录下的languages文件中对应的yml文档里配置相关联。比如你在站点根目录中的配置文件设置language为zh-Hans,那么就要进入到主题目录下的languages文件中修改zh-Hans.yml,这样才能显示出菜单项新增的中文内容(以something为例子)

添加标签页面

前面通过修改next主题下的_config.yml文件中的menu选项,可以在主页面的菜单栏添加标签选项,但是此时点击标签,跳转的页面会显示page not found。此时我们要新建一个页面

在新建的index.md文件中添加type: "tags"

当要为某一篇文章添加标签,只需在blog/source/_post目录下的具体文章的tags中添加标签即可,如:

成功后的页面为

之后大家就可以添加类似的页面,比如categories 分类。添加关于我的页面,步骤和以上差不多。

相关的优化


设置侧栏位置

修改主题目录下sidebar的position值

设置头像

在站点根目录下载配置文件中新增avatar,值设置为头像的链接地址。地址可以是网络地址,也可以是本地地址(放置在source/images/ 目录下)

设置文章代码主题

主题目录下修改配置文件highlight_theme,默认值为nomal。可以设置为night

修改底部的官方logo

找到 \themes\next\layout_partials\下面的footer.swig文件,打开会发现,如下图的语句:

第一个框 是下面侧栏的“日期❤ XXX”
如果想像我一样加东西,一定要在双大括号外面写。如:xxx{{config.author}},当然你要是想改彻底可以变量都删掉,看个人意愿。

第二个,是图一当中 “由Hexo驱动” 的Hexo链接,先给删掉防止跳转,如果想跳转当然也可以自己写地址,至于中文一会处理。注意删除的时候格式不能错,只把<a>...</a>标签这部分删除即可,留着两个单引号'',否则会出错哦。

第三个框也是最后一个了,这个就是更改图一后半部分“主题-Next.XX”,这个比较爽直接将<a>..</a>都删掉,同样中文“主题”一会处理,删掉之后在上一行 ‘-’后面可以随意加上你想显示的东西,不要显示敏感信息哟,请自重。

接下来,处理剩余的中文信息。找到这个地方\themes\next\languages\ 下面的语言文件zh-Hans.yml(这里以中文为例,有的习惯用英文的配置文件,道理一样,找对应位置即可)

看到了吧,这个就是传值传过去的,你想显示什么就在这里面大肆的去改动吧。其实在第二个框中,就可以把值都改掉,不用接受传值的方式,完全自己可以重写。不过我不建议那样做,因为传值这样只要是后续页面需要这几个值那么就都会通过取值去传过去,要是在刚才footer文件中直接写死,后续不一定哪个页面需要传值,但是值为空了或者还是原来的,可就尴尬了。所以还是这样改动吧。

最后的显示成果


博客地址:https://xiaowu-5759.github.io/

致谢

本文是作者的经验学习和见解思考,如有不足和漏洞,还请大家不吝赐教,必将积极纠正。本文引用其他文章内容,没有一一指出,若有侵权请联系作者,必会立即删除。尊重劳动成果,商业转载引用请联系作者获得授权并注明出处,非商业转载引用请注明出处。谢谢大家支持。
联系邮箱:1981293730@qq.com

参考资料

[1]Z皓.使用Hexo+Github一步步搭建属于自己的博客(进阶).来源:博客园,2017.10.22
[2]Nikkkki睡不醒.绝配:hexo+next主题及我走过的坑.来源:简书,2018.08.18

附录

我是熊丶小伍,一个逆风飞翔的菜鸟程序员。
热爱生活,喜欢挑战,略懂段子。
人生格言:为了梦想不懈地奋斗!
博客地址:https://xiaowu-5759.github.io/

封面:NexT主题网站

作者:熊丶小伍
时间:2019.01.06
来源:xiaowu5759,著作权归作者所有。
链接:https://xiaowu-5759.github.io/2019/02/26/3/

目录

  1. 安装启用NexT主题
  2. NexT主题的设置
  3. 相关的优化

引要

在利用Github Pages和Hexo搭建出拥有自己域名的博客。现在就来看看如何,美化和使用我们的个人博客。这里笔者使用的是比较简约的NexT主题,当然Hexo有很多其他主题,但是修改内容都是差不多的,大家可以积极探索。

正文

[搭建博客],hexo

安装启用NexT主题


  1. 安装NexT
    在博客文件夹中鼠标右键,点击Git Base Here。
    输入命令:
    git clone https://github.com/theme-next/hexo-theme-next themes/next

  2. 启用主题,在站点目录(blog)中,打开配置文件_config.yml,修改theme: next
  3. 验证主题,端口号要是被占用,就先修改端口号,然后启动服务

如果出现如上界面,就说明成功安装了NexT主题。

NexT主题的设置


主题设定

在next主题目录下的_config.yml文件中将scheme设定为Pisces

语言设定和标题设置

在站点根目录下修改配置文件_config.yml文件language为zh-Hans(简体中文)

修改菜单项

主题目录下修改配置文件_config.yml中的menu,增添一个something(注:千万不要在这设置中文,后面的值那是查找文件的地方!若你的站点运行在子目录中,请将链接前缀的/去掉)

这些配置都要与你主题目录下的languages文件中对应的yml文档里配置相关联。比如你在站点根目录中的配置文件设置language为zh-Hans,那么就要进入到主题目录下的languages文件中修改zh-Hans.yml,这样才能显示出菜单项新增的中文内容(以something为例子)

添加标签页面

前面通过修改next主题下的_config.yml文件中的menu选项,可以在主页面的菜单栏添加标签选项,但是此时点击标签,跳转的页面会显示page not found。此时我们要新建一个页面

在新建的index.md文件中添加type: "tags"

当要为某一篇文章添加标签,只需在blog/source/_post目录下的具体文章的tags中添加标签即可,如:

成功后的页面为

之后大家就可以添加类似的页面,比如categories 分类。添加关于我的页面,步骤和以上差不多。

相关的优化


设置侧栏位置

修改主题目录下sidebar的position值

设置头像

在站点根目录下载配置文件中新增avatar,值设置为头像的链接地址。地址可以是网络地址,也可以是本地地址(放置在source/images/ 目录下)

设置文章代码主题

主题目录下修改配置文件highlight_theme,默认值为nomal。可以设置为night

修改底部的官方logo

找到 \themes\next\layout_partials\下面的footer.swig文件,打开会发现,如下图的语句:

第一个框 是下面侧栏的“日期❤ XXX”
如果想像我一样加东西,一定要在双大括号外面写。如:xxx{{config.author}},当然你要是想改彻底可以变量都删掉,看个人意愿。

第二个,是图一当中 “由Hexo驱动” 的Hexo链接,先给删掉防止跳转,如果想跳转当然也可以自己写地址,至于中文一会处理。注意删除的时候格式不能错,只把<a>...</a>标签这部分删除即可,留着两个单引号'',否则会出错哦。

第三个框也是最后一个了,这个就是更改图一后半部分“主题-Next.XX”,这个比较爽直接将<a>..</a>都删掉,同样中文“主题”一会处理,删掉之后在上一行 ‘-’后面可以随意加上你想显示的东西,不要显示敏感信息哟,请自重。

接下来,处理剩余的中文信息。找到这个地方\themes\next\languages\ 下面的语言文件zh-Hans.yml(这里以中文为例,有的习惯用英文的配置文件,道理一样,找对应位置即可)

看到了吧,这个就是传值传过去的,你想显示什么就在这里面大肆的去改动吧。其实在第二个框中,就可以把值都改掉,不用接受传值的方式,完全自己可以重写。不过我不建议那样做,因为传值这样只要是后续页面需要这几个值那么就都会通过取值去传过去,要是在刚才footer文件中直接写死,后续不一定哪个页面需要传值,但是值为空了或者还是原来的,可就尴尬了。所以还是这样改动吧。

最后的显示成果


博客地址:https://xiaowu-5759.github.io/

致谢

本文是作者的经验学习和见解思考,如有不足和漏洞,还请大家不吝赐教,必将积极纠正。本文引用其他文章内容,没有一一指出,若有侵权请联系作者,必会立即删除。尊重劳动成果,商业转载引用请联系作者获得授权并注明出处,非商业转载引用请注明出处。谢谢大家支持。
联系邮箱:1981293730@qq.com

参考资料

[1]Z皓.使用Hexo+Github一步步搭建属于自己的博客(进阶).来源:博客园,2017.10.22
[2]Nikkkki睡不醒.绝配:hexo+next主题及我走过的坑.来源:简书,2018.08.18

附录

我是熊丶小伍,一个逆风飞翔的菜鸟程序员。
热爱生活,喜欢挑战,略懂段子。
人生格言:为了梦想不懈地奋斗!
博客地址:https://xiaowu-5759.github.io/

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,015评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,262评论 1 292
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,727评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,986评论 0 205
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,363评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,610评论 1 219
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,871评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,582评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,297评论 1 242
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,551评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,053评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,385评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,035评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,079评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,841评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,648评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,550评论 2 270

推荐阅读更多精彩内容