吾生有涯 学海无涯
析模有界 知识无界

搭建hexo博客[2]:空间及配置

光有hexo肯定是不够的,我们写的文章还需要放在网络上才行,因此还需要找网络空间放置hexo,总不能放在硬盘里吧。 

网络空间很多,收费的不收费的都有。收费的像各种云空间,百度云、腾讯云神马的都可以。免费的也不少,比较出名的像github空间,大部分玩计算机程序的应该都听说过。不过很遗憾的是github是国外的服务器,在国内访问可能比较慢。好在国内也有替代的,比较出名的像coding。下面以coding为例,描述如何申请空间,并部署hexo到空间中,最终使我们写的博客文章能够在网络上显示。

1

申请空间

进入coding网站(网址是https://coding.net/),选择左上角的注册按钮,在弹出的对话框中注册一个用户。如下图所示。注册完毕后系统会发送一封激活邮件,激活后就可以了。 

激活并登陆网站后,在首页选择创建新项目按钮,如下图所示。 

如下图所示进行设置。注意选择公开,博客文件夹名称可以随便取,我这里取名blog。点击创建项目按钮。 

在新的页面中选择Pages服务标签页,选择下方部署来源为master分支,点击保存按钮。 

如图所示,注意图中两个箭头位置,一个为本博客的访问地址,另一个箭头指向保存下来,后面配置hexo的时候要用。 

我们的博客访问地址是http://bestcfd.coding.me/blog,不过现在还无法访问,因为里头什么都没有。

空间申请到此完毕。下一步配置hexo环境。

2

hexo环境配置

hexo环境配置主要针对_config.yml文件。该文件位于前面创建的blog文件夹中,可以用文本编辑器编辑此文件。建议用notepad++、sublime text等有高亮显示的文本编辑器查看此文件。 

该文件中需要修改的内容并不多。我这里简单的配置一下。

  1. # Hexo Configuration

  2. ## Docs: http://hexo.io/docs/configuration.html

  3. ## Source: https://github.com/hexojs/hexo/

  4. # Site

  5. title: CFD仿真之道 ##站点标题

  6. subtitle: 一个讨论CFD仿真的博客##站点副标题

  7. description: ##站点描述

  8. author: 胡坤 ##作者

  9. language: zh-CN

  10. ##语言包,需要主题自带才可设置。设置简体中文填入 zh-CN

  11. timezone:

  12. # URL

  13. ## If your site is put in a subdirectory,

  14. ## set url as 'http://yoursite.com/child' and root as '/child/'

  15. url: http://bestcfd.coding.me/blog ##站点域名

  16. root: /blog/

  17. permalink: :year/:month/:day/:title/

  18. ##文章永久链接格式,可添加.html后缀,如 :title.html

  19. permalink_defaults:

  20. # Directory

  21. source_dir: source

  22. public_dir: public

  23. tag_dir: tags

  24. archive_dir: archives

  25. category_dir: categories

  26. code_dir: downloads/code

  27. i18n_dir: :lang

  28. skip_render:

  29. # Writing

  30. new_post_name: :title.md # File name of new posts

  31. default_layout: post

  32. titlecase: false # Transform title into titlecase

  33. external_link: true # Open external links in new tab

  34. filename_case: 0

  35. render_drafts: false

  36. post_asset_folder: false

  37. relative_link: false

  38. future: true

  39. highlight:

  40.  enable: true

  41.  line_number: true

  42.  tab_replace:

  43. # Category & Tag

  44. default_category: uncategorized

  45. category_map:

  46. tag_map:

  47. # Date / Time format

  48. ## Hexo uses Moment.js to parse and display date

  49. ## You can customize the date format as defined in

  50. ## http://momentjs.com/docs/#/displaying/format/

  51. date_format: YYYY-MM-DD

  52. time_format: HH:mm:ss

  53. # Pagination

  54. ## Set per_page to 0 to disable pagination

  55. per_page: 10

  56. pagination_dir: page

  57. # Extensions

  58. ## Plugins: http://hexo.io/plugins/

  59. ## Themes: http://hexo.io/themes/

  60. theme: landscape ##当前主题名称

  61. # Deployment

  62. ## Docs: http://hexo.io/docs/deployment.html

  63. deploy:

  64.  type: git

  65.  repo: https://git.coding.net/bestcfd/blog.git

  66.  branch: master

最为重要的配置为:

  1. deploy:

  2.  type: git

  3.  repo: https://git.coding.net/bestcfd/blog.git

  4.  branch: master

这里的repo就是前面提醒记住的箭头指向位置。

3

hexo常用命令

hexo的命令极简单,安装后只需要记住四个常用的即可。执行命令需要Git当前处于blog文件夹根目录下。

  • new创建新的博客文件

  1. hexo new "第一篇文章"

  • clean 清除缓存文件 (db.json) 和已生成的静态文件 (public)。

  1. hexo clean

  • generate 生成静态文件。

  1. hexo g

  • deploy 部署网站。部署网站前,需要预先生成静态文件。

  1. hexo d

在使用hexo d命令之前,需要执行命令:

  1. npm install hexo-deployer-git --save

4

文章测试

  • 在blog目录下启动git bash

  • 命令中输入hexo new "第一篇博客" 


  • 打开此文件(路径为E:workblogsource_posts第一篇博客.md),随便编辑点儿内容,如下图所示。 


  • 输入命令hexo clean

  • 输入命令hexo g

  • 输入命令hexo d 
    在输入hexo d命令后,可能会出现如下图所示的错误提示。 


  • 在命令行中输入如下图所示的命令。(引号中的内容可以随便输入) 


  • 继续输入hexo d,此时会弹出输入用户名和密码的对话框。将注册时所用的用户名和密码输入进去。 

 

如下图所示,文件push成功。 


可以打开空间提供的网站查看(如我刚才申请的地址http://bestcfd.coding.me/blog/),如下图所示。 

博客框架已经基本成型,已经基本上可以用了,如果你不觉得丑的话。明天将带领大家一步步修改主题,打造属于自己的博客。参考我已经配置好的博客http://www.bestcax.top。

本篇文章来源于微信公众号: CFD之道

赞(0) 打赏
版权声明:未经允许,请勿随意用于商业用途。
文章名称:《搭建hexo博客[2]:空间及配置》
文章链接:https://www.topcfd.cn/2577/
本站资源仅供个人学习交流,请于下载后24小时内删除,不允许用于商业用途,否则法律问题自行承担。
分享到

说两句 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者吧

非常感谢你的打赏,我们将继续给力更多优质内容,让我们一起创建更加美好的网络世界!

支付宝扫一扫

微信扫一扫

登录

找回密码

注册