Coding Pages 搭建 Hexo 静态博客

安装hexo

我的小窝:https://zelsonia.coding.me/hexo/

  • 准备:node.js(npm), git, coding账号
  1. npm install -g hexo 安装hexo

  2. 在本地sites下新建空文件夹来放置hexo touch hexo

  3. 初始化 hexo init

  4. 本地打开查看是否运行成功

$ hexo g
$ hexo s 
这两行命令是下面两个的缩写
hexo generate
hexo server

网址输入localhost:4000 查看效果

安装next主题

git clone git@github.com:iissnan/hexo-theme-next.git themes/next
如果想要其他主题,自行搜索,把ssh替换上面的git@github.com:iissnan/hexo-theme-next.git

  1. 安装好后,在根目录下的_config.yml配置文件修改
    修改Hexo目录下的config.yml配置文件中的theme属性,将其设置为nexttheme:next
    注意:Hexo有两个config.yml文件,一个在根目录,一个在theme下,此时修改的是在根目录下的。

  2. 清除缓存,重新生成,查看localhost:4000,看主题是否生效

hexo clean 清除缓存 网页正常情况下可以忽略此条命令
$ hexo g
$ hexo s

修改配置文件

coding新创建项目,把ssh copy下来,修改根目录的配置文件_config.yml,注意缩进,还有冒号后的空格

deploy:
  type: git
  repository:
      #github: git@github.com:ShomyLiu/ShomyLiu.github.io.git还可以github也一起
      coding: git@git.coding.net:shomyliu/shomyliu.git
  branch: master

在博客的source/目录下需要创建一个空白文件,至于原因,是因为 coding.net需要这个文件来作为以静态文件部署的标志。就是说看到这个Staticfile就知道按照静态文件来发布。
coding还需要在根目录下建一个.nojekyll空文件(coding page 配置hexo报错 the xx theme not be found
在根目录下建一个.nojekyll空文件就可以了,因为Coding默认支持Jekyll搭建网站)

cd source/
touch Staticfile 

cd ../
到hexo
touch .nojekyll

上到coding

  1. npm install hexo-deployer-git --save
    安装这个,要不之后会报错error deployer not found:git

  2. 上到coding
    hexo clean
    hexo d -g
    如果报错了,看看是不是之前提到过的报错。

  3. coding 上选择pages, 选master分支,他就自行部署了。成功后,若是没有样式,需要更改一下_config.yml文件,其中的url和root属性。

url:http://zelsonia.coding.me/hexoTest/
root: /hexoTest

ps: 整个这个文件夹不需要git init,push之类的操作。

报错

ERROR Script load failed: themes\next\scripts\tags\exturl.js
Error: Cannot find module 'hexo-util'

运行npm install hexo-util --save

next进阶

站点配置hexo/_config.yml

语言,和个人信息的部分,下面列出应该需要修改的,有的可能某一种theme下看不到

language: zh-Hans 
author
title
subtitle
description

主题配置next/_config.yml

tag页面点了404

添加目录云、标签云页面,不添加就会404
hexo new page "tags"
hexo new page "categories"
把主题配置文件里menu里对应的注释去掉,menu上就能看到分类和标签

添加新页面后,他的中文怎么改

如果添加了新的单词,就要添加翻译在文件里
languages/{language}.yml,例如简体中文就是zh-Hans.yml

侧边栏

sidebar positon
侧边栏位置,left,right

头像

avatar: url或者 /images/avatar.jpg
图片放在source/images下

缩略图

网站缩略图标icon
favicon: /favicon.ico
缩略图可以在这个网站做http://tool.lu/favicon/

代码高亮

code hightlight 高亮

github链接

social:
  #LinkLabel: Link
  GitHub: https://github.com/zelsonia

图标是social_icons

日志发布

发布新日志,新博客

hexo new "Hello"

然后到source/_post下编辑同名md文件再clean && d -g

ps: md文件里 ##后面需要空格

删除日志

直接_post下删了,再clean,d -g

日志添加分类,标签

生成md文件时,在顶部会有填写分类标签的地方,像这篇我就是这样写的

categories: hexo
tags: [hexo,node.js]

下面的日志,分类,标签是有了1个后才会出来,日志本来就有一篇,所以其他的两个一开始是没有的。

放音乐

打开网页版网易云音乐。
如果只是加入单曲,只需要搜索歌曲,点开歌曲名,点击生成外链播放器,复制html代码(可以选择是否自动播放),将html代码无需任何修改放入markdown文章里就OK了。
如果想要加入歌单,就需要自己创建歌单,然后分享歌单,找到自己的分享动态,点进去可以看到有“生成外链播放器”这些字眼,其余操作就和上面一样了。不过,你的歌单有变化的话,这个外链的歌曲同样跟着变,这一点挺棒的。

<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?type=2&id=471374061&auto=1&height=66"></iframe>

嵌入不自动播放只需要把以上代码中的auto改为=0即可,样子是这样的

<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?type=2&id=471374061&auto=1&height=66"></iframe>

阅读更多 设置

在文章的想要截断的区域, 添加这个``

其他应用

每篇文章的阅读量

http://www.tuicool.com/articles/YB3EJnz
注意事项是:config里已经有appid等参数,还有中文翻译那里也已经存在

本地图片方便引入

http://www.jianshu.com/p/c2ba9533088a

  1. 首先确认_config.yml 中有 post_asset_folder:true
  2. hexo下执行npm install https://github.com/CodeFalling/hexo-asset-image --save
  3. 之后新建的md会在_posts下出现同名文件夹,是放图片的,之后![](articleName/logo.jpg)

rss订阅

http://www.jianshu.com/p/264024768d03
这个教程的问题是
plugins: hexo-generate-feed这是一行的,上面写成两行会报错

首页footer页尾修改

首先,找到 \themes\next\layout_partials\下面的footer.swig文件,打开会发现,那两行就是最后三段
可以把div里的改成{{ __('footer.powered') }} 去翻译的文件里footer那里添加就行不要重复。

统计,评论,搜索

http://theme-next.iissnan.com/third-party-services.html#algolia-search
next官方给的好多扩展,我用了

  • 网易云跟帖 评论(需要一级域名)
  • 百度统计 人次
  • 不蒜子统计 首页统计
  • Algolia 搜索

里面都很详细了。
几点注意:1.百度统计不是站点上显示,是去那边看人次和次数。
2.hexo algolia 搜索,新增文章都要执行添加进index

没有一级域名,就暂时不能搞评论了。

更新hexo

更新hexo:
npm update -g hexo

更新主题:
cd 到主题文件夹,执行命令:
git pull

更新插件:
npm update

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

推荐阅读更多精彩内容