hexo建立github,gitcafe博客并实时同步的要点
把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上,你可以为你的任何仓库添加一个网站,你只需要:
- 把网站的页面push到这个仓库的gh_pages分支;(github有向导可以指引你自动创建这个分支)
- 通过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,),具有下面的优势:
- 使用markdown,完美支持github-flavored-markdown
- 实时本地预览,(#hexo s 创建一个本地http-server在本地实时预览你的博客网站)
- 大量丰富的主题模版(https://hexo.io/themes/)
- 支持Tex语法(通过mathjax:https://www.mathjax.org )
- 一键部署到多个站点(这个是我自己写的git脚本,下面有介绍)
使用hexo需要安装nodejs,npm,以及其他的依赖工具,网上教程不少,本文不赘述(遇到问题可以给我留言),不过特别提醒以下几点:
- .yml 配置文件采用缩进进行分开,key和value之间至少要有一个空格;
- 如果hexo生成的html里面有乱码,那是对应的源文件没有用UTF-8保存,你可以使用nodepadd++或者记事本把他们保存为UTF-8,然后重新生成即可;
- 使用
<!--more-->
用来分割摘要和正文,上面部分是摘要,会出现在主页。同wordpress。 - 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博客并实时同步的要点相关推荐
- Hexo 建立你的博客
利用hexo建立你的博客 准备条件 node运行环境; git环境(需要去github上拉取代码,同时以后也可以用这个把代码push到github上去) 开始工作 1.全局安装hexo 如果npm太慢 ...
- 使用 Hexo 创建 GitHub Page 博客(一)
CSDN GitHub Hexo 使用 Hexo 创建 GitHub Page 博客(一) AderXCoding/blob/master/system/tools/hexo/01-use_hexo ...
- 博客园实时同步更新【阅读感受更佳】
博客园实时同步更新,并且博客园已进行页面美化,阅读感受更佳. 一届书生-博客园 文本高亮美化 代码高亮美化,一键复制
- 基于Hexo和Github搭建博客
文章目录 一.前提 1.1 安装hexo 1.2 初始化hexo 1.3 hexo的一些命令 1.4 关于主题 1.4.1 修改主题 二.搭建github博客 2.1注册一个域名 三.配置ssh ke ...
- hexo搭建github.io博客
点击上方 "大前端圈"关注, 星标或置顶一起成长 每天早晨08点30分, 第一时间与你相约 Introduction 回顾一下我三年搭建博客的历程,最初是选择wordpress,W ...
- 手把手教你建github技术博客by hexo
适合人群 喜欢写Blog的人 有一定的编程基础 爱折腾的人 熟练使用版本控制Git 了解使用Github 熟悉基本的MarkDown语法 环境准备 安装Git 下载 msysgit 并执行即可完成安装 ...
- 【效率为王】超详细 Hexo + Github Pages 博客搭建教程
前言 现在市面上已经有许多博客了,比如 CSDN.掘金.博客园.简书等等.我们可以直接在上面发表内容,而且交互比较人性化,而且也能被搜索引擎检索到.但是总归是别人的平台,经常会受限,因此我们就希望能有 ...
- 如何使用Github+Hexo快速搭建个人博客
如何使用Github+Hexo快速搭建个人博客 可以移步地址:https://zyt505050.gitee.io/2019/01/27/ru-he-shi-yong-github-hexo-kuai ...
- GitHub+hexo+win10 搭建个人博客
GitHub+hexo+win10 搭建个人博客 个人感觉这篇很详细,值得收藏. http://hujichn.github.io/2016/04/06/Win10上利用github+hexo建立博客 ...
最新文章
- .net 程序加密方法
- ArrayList LinkedList与HashMap 实现原理
- Always keep in mind
- 支持向量机-SVM-最优化公式推导记录
- 手写公式识别 :基于深度学习的端到端方法
- 手把手教你构建食物识别AI:小白轻易可上手,人气高赞有Demo | 资源
- SharePoint Designer - View
- 编写 if 时尽量不要带 else
- 从头开始复习css之选择器(中)
- IDEA Maven Mybatis generator 自动生成代码
- 信号与系统 --- 傅里叶变换时/频对照表(个人学习笔记)
- Speedoffice(word)文档如何设置分栏
- Typo: In word xxxx
- 基于STM32cubemx的stm32f107vct6代码生成教程,实验一led闪烁
- size_t_梁斌_新浪博客
- SD3038B高效率恒流限流白光LED驱动IC
- 移动支付新发展:开拓支付领域,不止于支付服务
- java正则表达式原理_Java 正则表达式详解
- java开发项目中遇到的难点,帮你突破瓶颈
- Win10安装RNDIS驱动使用
热门文章
- python语言头像_python图像处理-个性化头像
- win10打开虚拟机就蓝屏重启
- 解决fixing(d:)stage 1问题
- NBU: nbcertcmd -getCAcertificate -server master_server_name command fails with EXIT STATUS 8500
- 但斌:买200年后还在的企业
- (原创)2021基于jsp、javaweb、ssm手机商城定制版v2.1
- C语言小项目:学生信息管理系统(超详细)
- python判断网络连通性_python 实现判断ip连通性的方法总结
- angular.js自定义指令
- 文心一言 VS 讯飞星火 VS chatgpt (40)-- 算法导论5.4 4题