把hexo博客的源码和生成的页面实时同步到github和gitcafe。

用搜索引擎搜索”github 博客”等关键字会出现大量很好的文章教小白一步步搭建。我这里列出一些关键点,希望可以让你少走弯路。这篇博客的markdown源代码在:https://gitcafe.com/cwjcsu/cwjcsu/blob/master/source/_posts/hexo-github-gitcafe.md
其他涉及的源码在同一个仓库可以找到。

1, 不一定要购买域名

很多文章都有介绍购买域名,并在根目录下配置CName文件,其实不一定要购买的。Github会给每个用户一个二级域名:cwjcsu.github.io。这个二级域名下,你可以定制样式、404页面等等,记住最重要的一点:你创建的github的仓库名称必须是cwjcsu.github.io,这样你只要在master分支上 仓库根目录push一个index.html,这个页面就可以通过 http://cwjcsu.github.io 访问到。cwjcsu是我的github用户名,实际操作中替换成你的即可。

2,使用gh_pages分支创建的页面

在github上,你可以为你的任何仓库添加一个网站,你只需要:

  1. 把网站的页面push到这个仓库的gh_pages分支;(github有向导可以指引你自动创建这个分支)
  2. 通过http://username.github.io/reponame 进行访问(即http://博客地址/仓库名称/)。我的github博客地址是:http://cwjcsu.github.io/,而joutable是我一个开源项目的仓库名称,它的页面可以通过http://cwjcsu.github.io/joutable 访问到

3,举例说明

我在github上面的首页是:https://github.com/cwjcsu
我在github上的博客源码仓库是:https://github.com/cwjcsu/cwjcsu.github.io
我在github上博客首页:http://cwjcsu.github.io
我的一个开源项目joutable仓库是:https://github.com/cwjcsu/joutable ,有两个分支,一个是master放置开源项目源码,一个是gh_pages放置项目介绍页面可以通过http://cwjcsu.github.io/joutable/ 访问

4,hexo搭建

hexo主页:https://hexo.io/
经过试用,hexo用来写博客真是不二选择(配合sublime Text3 +Markdown Editing,),具有下面的优势:

  1. 使用markdown,完美支持github-flavored-markdown
  2. 实时本地预览,(#hexo s 创建一个本地http-server在本地实时预览你的博客网站)
  3. 大量丰富的主题模版(https://hexo.io/themes/)
  4. 支持Tex语法(通过mathjax:https://www.mathjax.org )
  5. 一键部署到多个站点(这个是我自己写的git脚本,下面有介绍)

使用hexo需要安装nodejs,npm,以及其他的依赖工具,网上教程不少,本文不赘述(遇到问题可以给我留言),不过特别提醒以下几点:

  1. .yml 配置文件采用缩进进行分开,key和value之间至少要有一个空格;
  2. 如果hexo生成的html里面有乱码,那是对应的源文件没有用UTF-8保存,你可以使用nodepadd++或者记事本把他们保存为UTF-8,然后重新生成即可;
  3. 使用<!--more-->用来分割摘要和正文,上面部分是摘要,会出现在主页。同wordpress。
  4. description:xxx 会生成网页的description描述:<meta property="og:description" content="xxx">这是SEO需要注意的地方。

推荐几篇好文章:

hexo搭建博客:http://www.cnblogs.com/zhcncn/p/4097881.html
hexo的Jacman主题:https://github.com/wuchong/jacman
hexo配置介绍:https://hexo.io/docs/configuration.html
markdown大全:http://cwjcsu.gitcafe.io/2015/09/26/markdown-learning/

5,hexo部署

在hexo配置文件_config.yml 有个deploy的配置项目用来配置git仓库,注意type需设置为git,是hexo3中的类型,需要安装:hexo-deployer-git:

npm install hexo-deployer-git --save

网上的教程大多是hexo2的,很多文章没有指出这个区别。

#hexo deploy 可以一键部署到github仓库,但是我需要部署到不同仓库,所以没有采用hexo的自动部署,二是写了一个脚本:
在hexo生成的博客根目录cwjcsu.github.io下有个脚本:up.sh

#!/bin/bash

git commit -am "$1"
git push github master:master
git push gitcafe master:gitcafe-pages

于是,可以通过下面命令一键把生成的博客内容更新到github和gitcafe了。

#./up.sh "commit comment"

下面是我的git配置文件:cwjcsu.github.io/.git/config

[core]
repositoryformatversion = 0
filemode = false
bare = false
logallrefupdates = true
symlinks = false
ignorecase = true
hideDotFiles = dotGitOnly [remote "gitcafe"]
url = git@gitcafe.com:cwjcsu/cwjcsu.git
fetch = +refs/heads/*:refs/remotes/gitcafe/* [remote "github"]
url = git@github.com:cwjcsu/cwjcsu.github.io.git
fetch = +refs/heads/*:refs/remotes/github/* [branch "master"]
remote = github
merge = refs/heads/master

可以看到有两个remote:github和gitcafe,分别配置github和gitcafe上面我的博客所在的仓库地址。up.sh脚本中gitcafe的分支是gitcafe-pages而不是master,仓库名称也不是域名而是直接用户名。这是因为gitcafe博客与github博客略有不同,下面会介绍。
为了避免每次push都提示你输入用户名和密码,你需要在github和gitcafe中添加你的公钥,具体操作本文不赘述。[user]部分我没有贴出来。

6,gitcafe博客

与github不同的是,创建gitcafe的博客,你只需要创建一个和你的用户名一样的仓库,然后把页面push到这个仓库的gitcafe-pages分支即可,然后把源码push到这个分支的master。
比如:
博客所在仓库是:https://gitcafe.com/cwjcsu/cwjcsu
博客源码的分支是master:https://gitcafe.com/cwjcsu/cwjcsu/tree/master
博客页面分支是gitcafe-pages:https://gitcafe.com/cwjcsu/cwjcsu/tree/gitcafe-pages

这两个分支与github上两个仓库代码是同一份,我又写了个脚本,用来实时push博客源码到两个仓库:blog/up.sh: (blog是博客源码所在目录)

#!/bin/bash

git commit -am "$1"
git push github master:master
git push gitcafe master:master

blog/.git/config:

[core]
repositoryformatversion = 0
filemode = false
bare = false
logallrefupdates = true
symlinks = false
ignorecase = true
hideDotFiles = dotGitOnly [remote "gitcafe"]
url = git@gitcafe.com:cwjcsu/cwjcsu.git
fetch = +refs/heads/*:refs/remotes/gitcafe/* [remote "github"]
url = git@github.com:cwjcsu/blog.git
fetch = +refs/heads/*:refs/remotes/github/* [branch "master"]
remote = github
merge = refs/heads/master

[user]部分我没有贴出来。

7,配置评论系统和百度统计

我使用了国内很火的一个评论系统:多说,注册、添加站点后,只需要把ID设置到hexo主题的_config.yml文件里面即可(注意不是hexo的配置文件而是themes/jacman/_config.yml,jacman是我使用的一个主题)。添加百度统计网上教程很多不赘述。

hexo建立github,gitcafe博客并实时同步的要点的更多相关文章

  1. 使用Hexo搭建Github静态博客

    1. 环境环境 1.1 安装Git 默认配置就好 1.2 安装node.js 下载:http://nodejs.org/download/ 安装时直接保持默认配置即可. 2. 配置Github 1.1 ...

  2. 基于Hexo和Github搭建博客

    搭建自己的个人博客. 准备工作 确保电脑需要已下载安装node和npm.查看安装是否成功,windows只需在命令行输入以下两条命令即可. 1 2 $ node -v $ npm -v 安装hexo ...

  3. 使用hexo搭建github.io博客(一)

    使用github.io可以搭建一个自己的博客,把静态文件项目托管到github上,可以写博客,可以使用markdown语法,也可以展示作品.灵活性高.但是有较大的难度. node,git版本变化日新月 ...

  4. 使用hexo搭建github个人博客网站

    搭建步骤: 1>Mac或win电脑一台,本文以mac为例. 2>下载安装Git和Node 3>安装hexo 4>注册登录GitHub,创建一个仓库,库名格式为:GitHub用户 ...

  5. Hexo搭建Github静态博客

    1. 环境环境 1.1 安装Git 请参考[1] 1.2 安装node.js 下载:http://nodejs.org/download/ 可以下载 node-v0.10.33-x64.msi 安装时 ...

  6. 用hexo书写github.io博客 学习心得 教程

    很久没更新文章了,除了工作忙之外,可能就是自己懒惰了. 最近混迹与github,发现git上写博客也是个很不错的平台. 推荐使用 hexo 模版来书写,毕竟我们重点是写文章,而不是管理,所以有神奇何妨 ...

  7. Hexo结合github制作博客

    https://blog.csdn.net/Hoshea_chx/article/details/78826689 hexo(themes) vuePress jekylly

  8. github+hexo搭建自己的博客网站(七)注意事项(避免read.me,CNAME文件的覆盖,手动改github page的域名)

    详细的可以查看hexo博客的演示:https://saucxs.github.io/ 绑定域名可以查看:http://www.chengxinsong.cn 可以查看在github上生成的静态文件(如 ...

  9. Hexo + Github 个人博客设置以及优化

    原文地址: Hexo + Github 个人博客设置以及优化 一.博客设置 分类.标签云.关于等页面 在站点目录下分别执行: hexo new page "categories" ...

随机推荐

  1. CVE-2017-8635复现

    在最近几个月里,我花了一些时间深入了Device Guard以及如何实现用户模式代码完整性(UMCI).如果您对Device Guard不熟悉,您可以 在这里阅读更多信息.通常情况下,UMCI可防止未 ...

  2. Gym100814B Gym100814F Gym100814I(异或) ACM International Collegiate Programming Contest, Egyptian Collegiate Programming Contest (2015) Arab Academy for Science and Technology

    今日份的训练题解,今天写出来的题没有昨天多,可能是因为有些事吧... Gym100814B 这个题就是老师改卷子,忘带标准答案了,但是他改了一部分卷子,并且确定自己改的卷子没出错,他想从改过的卷子里把 ...

  3. CF 615D Multipliers

    题目:http://codeforces.com/contest/615/problem/D 求n的约数乘积. 设d(x)为x的约数个数,x=p1^a1+p2^a2+……+pn^an,f(x)为x的约 ...

  4. vue -- v-cloak解决刷新或者加载出现闪烁(显示变量)

    在使用vue绑定数据的时候,渲染页面时会出现变量闪烁,例如 <div class="#app"> <p>{{value.name}}</p> & ...

  5. [国嵌攻略][091][TCP网络程序设计]

    server.c #include <sys/socket.h> #include <netinet/in.h> #include <strings.h> #inc ...

  6. Winform 控件的入门级使用(一)

    开始总结一下控件的基本用法,方便以后查阅. 一.Label Label 的使用频率很高,基本上也没有什么难度. #region Winform //label label.Text = "这 ...

  7. 迈向c++的一次尝试

    从C到C++说着容易做起来也不难,今天做一下尝试. ★:题目介绍:今天是一次尝试所以先从简单的题开始. ★:试题分析:由题可了解到本题目的是要做到由一个数字到一个字符串的转变. 题目简单是由于它只是让 ...

  8. 织梦在服务器上面安装的时候一直提示data文件没有权限,可我已经写了权限,还是提示

    1.进入服务器,打开IIS,点击相应无权限的文件夹data,然后点击右上角的编辑权限. 2.勾选写入,然后确定即可. 3.织梦一直收到黑客的攻击,这里建议站长朋友设置下权限,来降低织梦系统的危险系数. ...

  9. Struts2学习笔记NO.1------结合Hibernate完成查询商品类别简单案例(工具IDEA)

    Struts2学习笔记一结合Hibernate完成查询商品类别简单案例(工具IDEA) 1.jar包准备 Hibernate+Struts2 jar包 struts的jar比较多,可以从Struts官 ...

  10. 利用 HTML5 WebGL 构建的 3D 拓扑图

    现在,3D 模型已经用于各种不同的领域.在医疗行业使用它们制作器官的精确模型:电影行业将它们用于活动的人物.物体以及现实电影:视频游戏产业将它们作为计算机与视频游戏中的资源:在科学领域将它们作为化合物 ...