Github Pages 搭建HEXO主题个人博客
2016-06-12 10:27
776 查看
跌跌撞撞,总算是建立起来了。回首走过的这么多坑,也真的是蛮不容易的。那么就写点东西,记录我是怎么搭建的吧。
安装Git:作用就是把本地的hexo内容commit到我们的远程仓库,实现更新操作https://git-scm.com/download/
申请GitHub账号:用来盛装我们的代码,这样才能够被访问,程序员如果没有这个账号,那我就不说什么了。
SSH Keys,看你自己了,可以不配制,不配置的话以后每次对自己的博客有改动提交的时候就要手动输入账号密码,配置了就不需要了。至于怎么配置,网上的资源很多。
随便找一个文件夹,然后右键使用gitbash打开:
npm install -g hexo // 即使用npm命令进行全局安装hexo
然后就是对这个文件夹进行初始化的操作:
hexo init
进行到这一步,基本上全部的安装工作也算是完成了。这个hexo init的文件夹,就是你的项目的根目录咯。
首先还是浏览一下常用的命令吧:
hexo new “postName” #新建文章
hexo new page “pageName” #新建页面
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口(默认端口4000,’ctrl + c’关闭server)
hexo deploy #将.deploy目录部署到GitHub
hexo help # 查看帮助
hexo version #查看Hexo的版本
然后我们就正式开始吧,使用hexo new “BlogName” 就可以创建一个新的.md文件(markdown文件,大家可以参考我之前的这篇文章。Markdown 入门与提高。
然后,我们可以进入到source文件夹下,通过查找就可以找到了。我们可以随意的使用任何的文本编辑器编写markdown类型的博客内容。写完之后,保存即可。
最后在git bash中使用
hexo generate // 生成html类型的博文
这样,我们的编辑工作就完成了。
当然了,我们要想使用git命令,得有一点git的基础才行。大家仍旧可以参考我之前的文章:
GitHub 如何提交代码,即问题汇总
Git客户端及常用的Git命令
然后最最重要的就是配置根目录下面的_config.yml文件了,具体的大家可以参考我的这个,有人可以到网上搜索一下。
接下来就可以部署我们已经编写好的博客内容了。
总的来说需要三个命令:
我的解决办法:
我每次完成编写,生成html之后。不会使用hexo deploy命令。
而是手动的在我的public文件夹下:
这样强制性的提交代码,就不会出现404错误了。
不过,跌跌撞撞。总算是完成了,接下来的任务就是更换主题,添加sitemap,以及添加评论功能了。大家可以参考下面的这篇好文
搭建HEXO静态博客
HEXO主题选择
准备工作
安装Node.js: 用于生成静态页面,我们需要到官网上去下载即可。http://nodejs.org安装Git:作用就是把本地的hexo内容commit到我们的远程仓库,实现更新操作https://git-scm.com/download/
申请GitHub账号:用来盛装我们的代码,这样才能够被访问,程序员如果没有这个账号,那我就不说什么了。
SSH Keys,看你自己了,可以不配制,不配置的话以后每次对自己的博客有改动提交的时候就要手动输入账号密码,配置了就不需要了。至于怎么配置,网上的资源很多。
安装HEXO
进行到这一步的前提是你已经安装好了Node.js和Git了,不然接下来的你是没办法进行下去的。随便找一个文件夹,然后右键使用gitbash打开:
npm install -g hexo // 即使用npm命令进行全局安装hexo
然后就是对这个文件夹进行初始化的操作:
hexo init
进行到这一步,基本上全部的安装工作也算是完成了。这个hexo init的文件夹,就是你的项目的根目录咯。
撰写博客
经过了刚才的那些繁琐的安装流程,接下来的就轻松了。我们只需要使用几个有限的命令,就可以生成页面精美的博客了。首先还是浏览一下常用的命令吧:
hexo new “postName” #新建文章
hexo new page “pageName” #新建页面
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口(默认端口4000,’ctrl + c’关闭server)
hexo deploy #将.deploy目录部署到GitHub
hexo help # 查看帮助
hexo version #查看Hexo的版本
然后我们就正式开始吧,使用hexo new “BlogName” 就可以创建一个新的.md文件(markdown文件,大家可以参考我之前的这篇文章。Markdown 入门与提高。
然后,我们可以进入到source文件夹下,通过查找就可以找到了。我们可以随意的使用任何的文本编辑器编写markdown类型的博客内容。写完之后,保存即可。
最后在git bash中使用
hexo generate // 生成html类型的博文
这样,我们的编辑工作就完成了。
部署博客到GitHub
我们可以手动的使用浏览器的方式进行upload文件,但是每次都要很繁琐的进行一系列的操作,我不太喜欢这种方式。所以我仍旧是用命令行来完成提交。当然了,我们要想使用git命令,得有一点git的基础才行。大家仍旧可以参考我之前的文章:
GitHub 如何提交代码,即问题汇总
Git客户端及常用的Git命令
然后最最重要的就是配置根目录下面的_config.yml文件了,具体的大家可以参考我的这个,有人可以到网上搜索一下。
# Hexo Configuration ## Docs: https://hexo.io/docs/configuration.html ## Source: https://github.com/hexojs/hexo/ # Site title: 博客主标题 subtitle: 人生的乐趣不止编程,但没有编程,一定不快乐! description: 记录进步的点点滴滴 author: 你的名字 language: default email: 你的邮箱 timezone: Asia/Hong_Kong # URL ## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/' url: http://guoruibiao.github.io root: / permalink: :year/:month/:day/:title/ permalink_defaults: # Directory source_dir: source public_dir: public tag_dir: tags archive_dir: archives category_dir: categories code_dir: downloads/code i18n_dir: :lang skip_render: # Writing new_post_name: :title.md # File name of new posts default_layout: post titlecase: false # Transform title into titlecase external_link: true # Open external links in new tab filename_case: 0 render_drafts: false post_asset_folder: false relative_link: false future: true highlight: enable: true line_number: true auto_detect: true tab_replace: # Category & Tag default_category: uncategorized category_map: tag_map: # Date / Time format ## Hexo uses Moment.js to parse and display date ## You can customize the date format as defined in ## http://momentjs.com/docs/#/displaying/format/ date_format: YYYY-MM-DD time_format: HH:mm:ss # Pagination ## Set per_page to 0 to disable pagination per_page: 10 pagination_dir: page # Extensions ## Plugins: https://hexo.io/plugins/ ## Themes: https://hexo.io/themes/ theme: landscape # Deployment ## Docs: https://hexo.io/docs/deployment.html deploy: type: git repository: git@github.com:你的GitHub账号/你的GitHub账号.github.io.git branch: master
接下来就可以部署我们已经编写好的博客内容了。
总的来说需要三个命令:
hexo clean // 清理文件 hexo generate // 生成目标的html hexo deploy // 发布
我遇到的问题
我遇到的问题比较的奇葩,我的配置文件明明是正确的,我也检查了好几遍,但是每次deploy的时候,它总会将我的项目文件全部的上传到我的GitHub仓库。导致我访问我的io账号的时候出现404错误。我的解决办法:
我每次完成编写,生成html之后。不会使用hexo deploy命令。
而是手动的在我的public文件夹下:
git add . git commit -m 'update' git remote add origin git@github.com:yourAccount/yourAccount.github.io.git git push -u origin master -f
这样强制性的提交代码,就不会出现404错误了。
总结
搭建Github Pages的这个流程说起来复杂,但是完成后看起来也不复杂。可能就在于对一个新知识的接受需要一个过渡吧。未知的总是充满着晦涩难懂的概念。不过,跌跌撞撞。总算是完成了,接下来的任务就是更换主题,添加sitemap,以及添加评论功能了。大家可以参考下面的这篇好文
搭建HEXO静态博客
HEXO主题选择
相关文章推荐
- 打开eclipse报错:发现了以元素 ‘d:skin’ 开头的无效内容。此处不应含有子元素
- [PHP][位转换积累]之异或运算的简单加密应用
- [leetcoide] 【字符串】28. Implement strStr()
- JAVA基础知识回顾-----File类-----实用
- Qt Qml 中Image的QSslSocket问题解决
- springmvc+mybatis+spring 整合
- Eclipse转战Android Studio心酸史
- java开发经典书籍
- ajax+php实现自动提示文本框
- yii框架中使用cookie和session
- [Java] super,this 的区别及构造方法的使用
- [Java] 获取随机数的3种方法
- GC的介绍
- mysql新建数据表 命令行与php方式
- C++编程的“读”与“写”操作
- java代码调用使用cxf搭建的webService服务传递对象
- 【转载】C++之继承与多态
- 大整数加法计算思路与算法实现
- JAVA 中IO总结 之前篇阻塞、非阻塞
- 学习练习 java练习小题题目:判断一个整数能被几个9整除