Hexo+Github创建博客

准备工具node.js和git

安装node.js

window童鞋点这里
mac童鞋点这里
linux童鞋点这里

安装git

window童鞋点这里
mac童鞋点这里
linux童鞋点这里

用hexo创建博客

下面的命令,你们可以在cmd中也可以用git中的git bash都可以,输入每个命令之后别忘了一个enter执行

mkdir blog  创建一个博客文件夹
cd blog   进入目录
npm install hexo-cli -g(对这个文件夹全局安装依赖一次就够了,后面可以直接使用hexo相关的操作)
hexo init(初始化hexo)
hexo generate生成静态页面到public文件夹,等待deploy部署
hexo server(测试页面) http://localhost:4000

这一步就ok了,你可以到目录source/_posts看到md文件,这里就是我们以后要编辑的博客,当然不会md语法的请查看我的另一篇文章

开始写博客吧

新建文章:如hexo new "新建文章的标题"
hexo new photo "标题" 生成一个带头图的文章,不过大可以不用,因为layout: photo经测试可以省略,直接写photos: 图片地址
新建了之后,要查看写的结果,就用执行命令hexo server,之后访问本地回流地址http://localhost:4000

部署的相关配置

编辑配置文件:vi _config.yml

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site 网站信息
title: 网站标题
subtitle: 网站副标题
description: 网站描述
author: 网站作者名字
language: #网站语言,默认是英语(en)
timezone: #网站时区

# URL 网站设置
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: seayxu.github.io #网站的地址
root: / #网站的根目录,如果是子文件夹下,则填写子文件夹路径
permalink: :year/:month/:day/:title/ #文章链接地址格式 
permalink_defaults:

# Directory 目录设置
source_dir: source #资源文件夹,默认是source
public_dir: public #公共文件夹,默认是public
tag_dir: tags #标签文件夹,默认是tags
archive_dir: archives #档案文件夹,默认是archives
category_dir: categories #分类文件夹,默认是categories
code_dir: downloads/code #代码文件夹,默认是downloads/code
i18n_dir: :lang #国际化文件夹,默认跟language相同
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: false
  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 #每页显示数量,设置为0表示不启用分页
pagination_dir: page #分页文件夹名称

# Extensions 扩展
## Plugins: https://hexo.io/plugins/ #插件
## Themes: https://hexo.io/themes/ #主题
theme: landscape #主体名称
feed:
  type: atom
  path: atom.xml
  limit: 20
    #type 表示类型, 是 atom 还是 rss2.
    #path 表示 Feed 路径
    #limit 最多多少篇最近文章
sitemap:
  path: sitemap.xml
  #path 表示 Sitemap 的路径. 默认为 sitemap.xml.
baidusitemap:
  path: baidusitemap.xml
# Deployment 部署
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: git@github.com:xuywei/xuywei.github.io.git #github仓库地址
  branch: master # github分支

部署到github

创建github仓库:用户名.github.io 如:xuywei.github.io
然后执行hexo deploy就自动提交.deploy_git的文件到部署配置的github仓库

hexo generate生成静态页面(静态内容在public文件夹内,这个文件夹是以后发布到github中的文件)
hexo clean删除public文件夹中的内容(其实并没有啊,大概是清理缓存的缘故)
hexo deploy部署hexo

部署的时候会提示没有发现git,使用npm install hexo-deployer-git --save安装git插件,再次重新部署就可以了

总结

  1. 安装node.js和git
  2. 安装hexo
npm install -g hexo
  1. 部署hexo
mkdir blog
cd blog
hexo init

执行之后会生成以下文件

.deploy:执行hexo deploy命令部署到GitHub上的内容目录
public:执行hexo generate命令,输出的静态网页内容目录
scaffolds:layout模板文件目录,其中的md文件可以添加编辑
scripts:扩展脚本目录,这里可以自定义一些javascript脚本
source:文章源码目录,该目录下的markdown和html文件均会被hexo处理。该页面对应repo的根目录,404文件、favicon.ico文件,CNAME文件等都应该放这里,该目录下可新建页面目录。
_drafts:草稿文章
_posts:发布文章
themes:主题文件目录
_config.yml:全局配置文件,大多数的设置都在这里
package.json:应用程序数据,指明hexo的版本等信息,类似于一般软件中的关于按钮
  1. 创建博客
hexo new "博客的文章名"
hexo new page "比如about页面"
  1. 生成静态页面
hexo clean先清除缓存
hexo generate生成页面
  1. 本地发布
hexo server可以输入127.0.0.1:4000打开你的博客
  1. 发布到github
hexo deploy将public中的静态页面复制到.deploy文件夹中并提交到github
  1. 一些简易命令
hexo命令缩写:
          hexo n:hexo new
          hexo g:hexo generate
          hexo s:hexo server
          hexo d:hexo deploy
hexo命令组合:
          hexo deploy -g
          hexo server -g

注意:命令不要随意组合,会没有效果

  1. 写博客的一些小细节


    博客的样式图
layout: photo #这个属性是博客的样式,有一个头图样式,如上图
title: test2 #标题
date: 2016-09-20 13:55:04 #写作时间
tags: [haha,toot,huhu] #多个标签
photos: http://bruce.u.qiniudn.com/2013/11/27/reading/photos-1.jpg #图片的地址
description: 你对本页的描述--- #只是对文章的一个描述,点开文章不会再有
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,686评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,668评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,160评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,736评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,847评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,043评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,129评论 3 410
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,872评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,318评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,645评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,777评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,470评论 4 333
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,126评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,861评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,095评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,589评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,687评论 2 351

推荐阅读更多精彩内容