本文介绍了什么是Github Page。以及如何使用Github Page搭建一个免费的、无限流量的个人博客并绑定独立域名。

一、前言



1.1 为什么要用Github Page搭建博客



借用阮一峰老大的话说,

喜欢写Blog的人,会经历三个阶段。

1.第一阶段,刚接触Blog,认为非常新奇,试着选择一个免费空间来写。

2.第二阶段。发现免费空间限制太多,就自己购买域名和空间,搭建独立博客。

3.第三阶段,认为独立博客的管理太麻烦。最好在保留控制权的前提下,让别人来管。自己仅仅负责写文章。

那么Github Page无疑就是第三个阶段最Geek范儿的选择了。

1.2什么是Github Page



简单的说。Github是一个具有版本号管理功能的代码仓库,每一个项目都有一个主页,列出项目的源文件。

可是对于一个新手来说。看到一大堆源代码,仅仅会让人头晕脑涨,不知何处入手。

他希望看到的是,一个简明易懂的网页,说明每一步应该怎么做。

因此,github就设计了Pages功能。同意用户自己定义项目首页,用来替代默认的源代码列表。

所以。github Pages能够被觉得是用户编写的、托管在github上的静态网页。

二、安装本地Git环境



2.1 安装MyGit



首先在Github上注冊账号,然后下载Windows下的GitclientMyGit,一路next至安装完成。

找到桌面的Git Bash,双击打开,熟悉的命令行界面就出来了。

使用cd命令进入你想要的文件夹。比方我进入了d:/working/Git

2.2 改动Git Bash默认工作路径



值得注意的是,普通情况下打开Git Bash后默认的路径一般都是C:/Users/username,每次工作都得切换到经常使用的文件夹下,此操作是反复且没有意义的。

我们打开Git安装位置\etc\profile文件,找到

# normalize HOME to unix path

HOME="$(cd"$HOME" ; pwd)"

export PATH="$HOME/bin:$PATH"

添加两行。改动后结果例如以下:

# normalize HOME to unix path

HOME="你想要改动的HOME路径"

HOME="$(cd"$HOME" ; pwd)"

cd

export PATH="$HOME/bin:$PATH"

很多其它的改动路径及自己定义Bash路径变量,參考这里

至此,本地的Git环境已经搭建完成。

三、配置Github



3.1 本地生成SSH公钥



为了保证与server通信的安全,Github仅仅提供HTTPS和SSH两种连接方式。这里我们使用SSH。

在Git bash中输入

$ ssh-keygen -t rsa -C "your_email@youremail.com"

看到下面信息,输入你的Githubpassword:

# Creates a new ssh key using the providedemail Generating public/private rsa key pair.

Enter filein which to save the key (/home/you/.ssh/id_rsa):

Enter passphrase (emptyforno passphrase): [Type
a passphrase]

Enter same passphrase again: [Type passphrase again]

然后你在你的文件夹下会发现有一个.ssh文件夹,里面有一个id_rsa文件和一个id_rsa.pub文件。说明SSH私钥和公钥已经成功生成了。

3.2 将SSH公钥加入到Github



在Github站点上找到Account Setting ->"SSH Keys" -> Add SSH key,将id_rsa.pub中的内容粘贴到key一栏。点击addkeybutton。

在Git Bash中输入下面代码測试:

ssh -T git@github.com

假设你看到了下面结果,说明成功了:

The authenticity of host'github.com (207.97.227.239)' can't beestablished.

RSA key fingerprint is16:27:ac:a5:76:28:2d:36:63:1b:56:4d:eb:df:a6:48.

Are you sure you want to continue connecting(yes/no)?[Type yes]

Hi username!

You've successfully authenticated, butGitHub doesnot
provide shell access.

四、创建你的Github Page



登录https://github.com/yourname,点击Repositories-> New创建一个新的仓库。

注意。Repositoryname一定要设置为yourname.github.io,其它选项默认,点确认

然后在这个仓库的页面https://github.com/yourname/yourname.github.io的右边栏点Settings

往下拉找到GitHubPages -> Automatic Page generator,一路Next就可以

等几分钟。訪问http://yourname.github.io就能看到你创建的页面了。

五、本地改动网页和上传



在仓库页面右边栏,有一个SSH clone URL,将里面的内容复制下来

在Git Bash中输入:

$ git clone 你复制的内容

看看你的工作文件夹下。Github帮你自己主动生成的站点就被复制下来了,文件夹结构类似于:

--images

--javascripts

--stylesheets

index.html

params.json

尝试更改一下index.html,比方将

<title>Test</title>

改成:

<title>我的博客</title>

然后在Git Bash里面依次输入以下三个命令

$ git add -A

$ git commit -m "change title of index.html"

$ git push

这三个命令的意义及很多其它git命令的使用方法,见这里

上传完成后。等几分钟,刷新页面,就会发现页面的标题已经变成“我的博客”了。

六、自己定义博客的主题和页面



Github Page仅仅是一个静态页面托管服务,也就是说不能执行php和mysql等程序。

Github Page同意站内生成网页(比方我们刚刚做的那样)。

也同意用户自己编写网页上传,仅仅只是上传的网页会经过Jekyll程序的再处理。

用Github Page建立博客的思路:

  • 使用Jekyll语言人工编写符合规范的代码上传(不推荐)
  • 使用基于Jekyll的Octopress静态博客系统搭建(推荐)
  • 使用其它基于Jekyll的静态博客主题。比方HPSTR或Hexo(推荐)

这里使用的是HPSTR主题,它的演示样例链接是这里

它本身就是一个Github Page。我们找到它的git地址clone下来

$ git clone git@github.com:mmistakes/hpstr-jekyll-theme.git

复制它的文件到你自己的目录里,然后依照配置提示改动參数、上传就可以

HPSTR主题里有几篇默认文章。解说了一下怎样写文章以及一些简单的Markdown语法等等。

其它主题的安装方法也非常类似,就不一一说明了。

七、绑定域名



假设你想要显得更Geek一点,还能够绑定独立域名。

如果你已经有一个域名yourname.com,在你的代码仓库的根文件夹下创建一个名为CNAME的文件。注意没有后缀名。

里面写入你要绑定的域名,比方youname.com

然后前往你的域名托管商处,新增一条CNAME类型的解析记录,指向yourname.github.io

小时不等。

等解析生效,你就能够使用你的

(完)

本文首发http://www.dss886.com。转载请注明

版权声明:本文博客原创文章。博客,未经同意,不得转载。

零基Github Page个人博客建立教程无限的自由流动的更多相关文章

  1. 可能是最详细的 Hexo + GitHub Pages 搭建博客的教程

    前言:博主目前大三,Web 前端爱好者.写博客的好处,不是为了写而写,而是一个记录思想的过程.不要考虑它能带给你什么,而是你自己从中收获了什么. 最近刚好有空,于是就参照网上的各种教程,搭建了一个博客 ...

  2. 利用github page搭建博客

    为什么选择GitHub Pages? 很多人用 wordpress,你为什么要用 github pages 来搭建? 1.github pages有300M免费空间,资料自己管理,保存可靠: 2.学着 ...

  3. Github page搭建博客使用自定义插件的方法

    Github page的后台程序是由Jekyll搭建,但由于Github的保护措施,非认证的plugin一般不会被Github page支持,但可以使用一些小技巧来绕过屏蔽. 以个人page为例,个人 ...

  4. hexo与github page搭建博客

    安装 npm i hexo-cli -g hexo init blog cd blog npm install hexo server 发布hexo到github page npm i hexo-de ...

  5. 使用hexo+github搭建免费个人博客详细教程

    [TOC] 本文目录(注意无法点击): 前言 体验更加排版请访问原文链接:http://blog.liuxianan.com/build-blog-website-by-hexo-github.htm ...

  6. github文件上传及github pages博客搭建教程

    一.与github建立连接 1.安装node.js和git 2.桌面新建文件夹[github],右键“git bash here” 3.注册github账号,新建仓库“new repository”, ...

  7. 【教程向】——基于hexo+github搭建私人博客

    前言 1.github pages服务生成的全是静态文件,访问速度快: 2.免费方便,不用花一分钱就可以搭建一个自由的个人博客,不需要服务器不需要后台: 3.可以随意绑定自己的域名,不仔细看的话根本看 ...

  8. 《Hexo+github搭建个人博客》

    <Hexo+github搭建个人博客> 文/冯皓林 完稿:2016.4.22-2016.4.23 注意:本节教程只针对Windows用户.本教程由无人赞助,赞助写出. <Hexo+g ...

  9. Hexo静态博客搭建教程

    Hexo是一个快速.简洁且高效的博客框架.Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页.生成静态网页可以托管在github.下面简单介绍一下he ...

随机推荐

  1. linux下&quot;=&quot;号与&quot;==&quot;号

    <鸟哥的linux私房菜>基础学习篇P382中说,在bash中"="与"=="是同样的,都代表推断是否相等,仅仅只是因为其它语言一般写法使用&quo ...

  2. 我理解设计模式C++实现观察者模式Observer Pattern

    概述: 近期中国股市起起伏伏,当然了起伏就用商机,小明发现商机后果断想入市,买入了中国证券,他想在电脑client上,网页上,手机上,iPad上都能够查看到该证券的实时行情,这样的情况下我们应该怎么设 ...

  3. 抓取csdn上的各类别的文章 (制作csdn app 二)

    转载请表明出处:http://blog.csdn.net/lmj623565791/article/details/23532797 这篇博客接着上一篇(Android 使用Fragment,View ...

  4. 王立平--怎么查看Unity的版本号

    1.打开Unity,Help->About Unity 2.版本

  5. HDFS建筑与shell操作

    一个.hadoop1.1.0演示 hadoop它适合于大容量数据存储和分布式计算平台 hadoop核心由hdfs和mapreduce组成 hdfs这是一个主从结构,仅有一个.是namenode:从节点 ...

  6. flashfxp3.41中文版注册码:(适合最新版本)

    推荐(尚未被封的 Realkey) FLASHFXPvACq2ssbvAAAAAC1W7cJKQTzmx77zmqJICvA7d3WnU tWNXdrp8YuERRFdIvXfOPbcpABkVix2 ...

  7. 在Linux终端下使用代理访问网络(转)

    最近,需要在linux环境下使用脚本进行一些网络访问(主要是HTTP请求与文件下载),于是查阅了一些关于代理的资料. 以下是尝试的几种代理设置方法,以供参考: 一.使用wget命令进行代理访问 wge ...

  8. uva--165(邮资问题,dp)

    题意: 某国家发行k种不同面值的邮票,而且规定每张信封上最多仅仅能贴h张邮票. 公式n(h,k)表示用从k中面值的邮票中选择h张邮票,能够组成面额为连续的1.2.3,--n. n是能达到的最大面值之和 ...

  9. 我学cocos2d-x (两) 采用Delegate(信托)

    Delegate(信托)什么 Delegate是ios开发中的一个概念,主要是为了让类A中的功能,放到类B中来实现,这样能够合理的把功能划分到不同的文件里进行实现,从而更好的实现模块的分离.如UIAp ...

  10. hdu 3652 B-number(数字dp)

    http://acm.hdu.edu.cn/showproblem.php? pid=3652 大致题意:"B-number"即一个整数含有子串"13"且被13 ...