把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是我使用的一个主题)。添加百度统计网上教程很多不赘述。

转载于:https://www.cnblogs.com/cwjcsu/p/8433060.html

hexo建立github,gitcafe博客并实时同步的要点相关推荐

  1. Hexo 建立你的博客

    利用hexo建立你的博客 准备条件 node运行环境; git环境(需要去github上拉取代码,同时以后也可以用这个把代码push到github上去) 开始工作 1.全局安装hexo 如果npm太慢 ...

  2. 使用 Hexo 创建 GitHub Page 博客(一)

    CSDN GitHub Hexo 使用 Hexo 创建 GitHub Page 博客(一) AderXCoding/blob/master/system/tools/hexo/01-use_hexo ...

  3. 博客园实时同步更新【阅读感受更佳】

    博客园实时同步更新,并且博客园已进行页面美化,阅读感受更佳. 一届书生-博客园 文本高亮美化 代码高亮美化,一键复制

  4. 基于Hexo和Github搭建博客

    文章目录 一.前提 1.1 安装hexo 1.2 初始化hexo 1.3 hexo的一些命令 1.4 关于主题 1.4.1 修改主题 二.搭建github博客 2.1注册一个域名 三.配置ssh ke ...

  5. hexo搭建github.io博客

    点击上方 "大前端圈"关注, 星标或置顶一起成长 每天早晨08点30分, 第一时间与你相约 Introduction 回顾一下我三年搭建博客的历程,最初是选择wordpress,W ...

  6. 手把手教你建github技术博客by hexo

    适合人群 喜欢写Blog的人 有一定的编程基础 爱折腾的人 熟练使用版本控制Git 了解使用Github 熟悉基本的MarkDown语法 环境准备 安装Git 下载 msysgit 并执行即可完成安装 ...

  7. 【效率为王】超详细 Hexo + Github Pages 博客搭建教程

    前言 现在市面上已经有许多博客了,比如 CSDN.掘金.博客园.简书等等.我们可以直接在上面发表内容,而且交互比较人性化,而且也能被搜索引擎检索到.但是总归是别人的平台,经常会受限,因此我们就希望能有 ...

  8. 如何使用Github+Hexo快速搭建个人博客

    如何使用Github+Hexo快速搭建个人博客 可以移步地址:https://zyt505050.gitee.io/2019/01/27/ru-he-shi-yong-github-hexo-kuai ...

  9. GitHub+hexo+win10 搭建个人博客

    GitHub+hexo+win10 搭建个人博客 个人感觉这篇很详细,值得收藏. http://hujichn.github.io/2016/04/06/Win10上利用github+hexo建立博客 ...

最新文章

  1. .net 程序加密方法
  2. ArrayList LinkedList与HashMap 实现原理
  3. Always keep in mind
  4. 支持向量机-SVM-最优化公式推导记录
  5. 手写公式识别 :基于深度学习的端到端方法
  6. 手把手教你构建食物识别AI:小白轻易可上手,人气高赞有Demo | 资源
  7. SharePoint Designer - View
  8. 编写 if 时尽量不要带 else
  9. 从头开始复习css之选择器(中)
  10. IDEA Maven Mybatis generator 自动生成代码
  11. 信号与系统 --- 傅里叶变换时/频对照表(个人学习笔记)
  12. Speedoffice(word)文档如何设置分栏
  13. Typo: In word xxxx
  14. 基于STM32cubemx的stm32f107vct6代码生成教程,实验一led闪烁
  15. size_t_梁斌_新浪博客
  16. SD3038B高效率恒流限流白光LED驱动IC
  17. 移动支付新发展:开拓支付领域,不止于支付服务
  18. java正则表达式原理_Java 正则表达式详解
  19. java开发项目中遇到的难点,帮你突破瓶颈
  20. Win10安装RNDIS驱动使用

热门文章

  1. python语言头像_python图像处理-个性化头像
  2. win10打开虚拟机就蓝屏重启
  3. 解决fixing(d:)stage 1问题
  4. NBU: nbcertcmd -getCAcertificate -server master_server_name command fails with EXIT STATUS 8500
  5. 但斌:买200年后还在的企业
  6. (原创)2021基于jsp、javaweb、ssm手机商城定制版v2.1
  7. C语言小项目:学生信息管理系统(超详细)
  8. python判断网络连通性_python 实现判断ip连通性的方法总结
  9. angular.js自定义指令
  10. 文心一言 VS 讯飞星火 VS chatgpt (40)-- 算法导论5.4 4题