GithubPages ,the Websites for you and your projects. Hosted directly from your GitHub repository. Just edit, push, and your changes are live.php

上面簡單的一句話，就說明了 GithubPages 的本質：託管在github上面的我的站點頁面，使用markdown 來寫文章，簡單、易用，不用在意太多的排版工做，並且免費。html

說完了這兩個概念，就能夠說一說 ixirong.com 整個站點的創建過程了，總結爲使用hexo搭建博客，託管在 githubpages（國外）和 gitcafe（國內）上，監控使用阿里雲+360雲監控（兩個託管商服務仍是很穩定的），統計流量採用老牌 CNZZ 數據專家，站長工具採用百度站長，也參考google站長。詳細以下：java

域名申請

域名我選擇了國外的服務商 Godaddy，詳情請參考如何在Godaddy申請域名？，固然你也能夠選擇萬網、新網、西部數碼或者新生高傲的google域名註冊服務。git

域名備案

採用 github Pages 服務，是不須要備案的，當若是你想使用七牛的自定義域名、CDN服務、站長助手的一些高級功能使用，是須要有備案的，詳情請參考個人另外一篇單獨博客我的godaddy域名備案解決方案。github

域名解析

採用頂尖老牌服務 dnspod ，穩定、高效、實時生效，詳細方法請參考Godaddy註冊商域名修改DNS解析方法，若有任何疑問，能夠查看幫助中心。web

hexo 寫博客

hexo是由Node.js驅動的一款快速、簡單且功能強大的博客框架，它和jekyll相比，更快，更輕量，命令更簡單（並且jekyll不少缺點）。網友已經寫過這方面的好多文章了，當時我主要參考的以下，固然你也能夠google搜索下使用方法數據庫

2015-05-19 更新，若是你嫌下面的文章太長了，有沒有一篇完整的、詳細的介紹，很高興，@cnFeat就是這樣子一我的，詳情見文章：
如何搭建一個獨立博客——簡明Github Pages與Hexo教程安全

使用hexo搭建博客
hexo你的博客
hexo系列教程：（一）hexo介紹
hexo系列教程：（二）搭建hexo博客
hexo系列教程：（三）hexo博客的配置、使用
hexo系列教程：（四）hexo博客的優化技巧
hexo系列教程：（五）hexo博客的優化技巧續
彙總優化技巧 Hexo 優化與定製(一)
hexo 搭建博客同時使用 GitHub 和 GitCafe 兩個服務商，國內訪問 GitCafe，國外訪問GitHub，設置方法參見博客

圖牀靜態資源

雲存儲這東西，目前存在不少七牛雲、又拍雲、阿里雲、騰訊雲均可以用來作圖片存儲，ixirong.com 選擇的是七牛，爲何？靠，免費啊~ 固然，七牛的精力一直在作這塊，仍是很不錯的，註冊七牛雲，創建個空間，上傳圖片，點擊圖片連接就能夠訪問了，把這些圖片連接放到你的博客中使用到的地方就ok了。默認的七牛域名比較長，已經備案的域名能夠申請自定義，好比ixirong.com 的自定義爲 static.ixirong.com域名，你能夠看看下面這張圖：
服務器

站點統計、監控、站長助手

使用百度站長工具來進行百度分享、百度統計、SEO優化等的調整，使用google站長工具主要是分析國外流量來源，使用cnzz數據專家進行全方位的統計分析工做。

網站的監控採用阿里雲和360監控，基本上覆蓋了全國地區的檢測點，二者都有免費的報警短信（1000條/月），小站點足夠使用了以下圖：

騰訊雲CDN使用

前段時間DNSPod聯合騰訊雲贈送免費CDN服務，我整了一個，使用體驗了下，CDN的設置仍是挺簡單的，具體見圖片便可，全國電信、聯通、移動的用戶訪問 http://www.ixirong.com 速度上面應該挺快的，能夠嘗試下。

hexo 靜態博客上線文章打賞功能，支持支付寶、微信支付捐贈

發表於 2015-05-24 | 分類於網站建設 | 8條評論

目前微信公衆號(須要開發)、微博、簡書（部分文章）都有了「賞」的功能，說白了，就是你的文章對閱讀者有必定的幫助，閱讀者願意支付必定的費用來支持做者繼續寫做，寫出好文章，這也表明着內容付費時代的慢慢到來，固然這對於做者來講也是必定的鼓勵，一樣也是要求，你必須寫出靠譜的文章，讓人感到值得付出金錢的文章，讀者纔會心甘情願的給你打賞。
下面就說一說，hexo 框架下的文章如何來支持此功能，我使用的主題 NexT ，固然是xirong 定製過的版本，已經支持了此功能，若是你也是用 hexo ，而且感受 next 主題還不錯，你能夠直接fork下來，直接使用便可。那麼這個功能是怎麼開發出來的呢，若是我是其餘的博客，我該怎麼樣作才能夠支持打賞的功能？
其實只須要在你文章的你想要出現賞功能的位置，添加以下代碼便可：

<! -- 添加捐贈圖標 -->
 <div class ="post-donate">
 <div id="donate_board" class="donate_bar center">
 <a id="btn_donate" class="btn_donate" href="javascript:;" title="Donate 打賞"></a>
 <span class="donate_txt">
 &uarr;<br>
 Enjoy it ? Donate me ! 欣賞此文？求鼓勵，求支持！
 {% endif %} 
 </span>
 <br>
 </div> 
 
 <!-- 支付寶打賞圖案 -->
 <div id="donate_guide" class="donate_bar center hidden">
 <a href="http://static.ixirong.com/pic/donate/alipay1.webp" title="支付寶打賞" class="fancybox" rel="article0" style="float:left;margin-left:25%;margin-right:2px;">
 <img src="http://static.ixirong.com/pic/donate/alipay1.webp" title="支付寶打賞" height="164px" width="164px">
 </a> 
 </div>

 <!-- 微信打賞圖案 -->
 <div id="donate_guide" class="donate_bar center hidden">
 <a href="http://static.ixirong.com/pic/donate/wechat.png" title="支付寶打賞" class="fancybox" rel="article0" >
 <img src="http://static.ixirong.com/pic/donate/wechat.png" title="支付寶打賞" height="164px" width="164px">
 </a> 
 </div>
 
 <script type="text/javascript">
 document.getElementById('btn_donate').onclick = function(){
 $('#donate_board').addClass('hidden');
 $('#donate_guide').removeClass('hidden');
 }
 </script>
 </div>
<! -- 添加捐贈圖標 -->

我把兩個打賞的地方簡化出來，你只須要將支付寶、微信的打賞圖片替換成你本身的就ok了，這段代碼，隨便放到任何的博客文章中都是ok的，NeXT 的主題進行了單獨的定製化，詳情參考 github wiki 說明增長博客打賞功能。

文章參考： http://icehe.me/2015/03/04/Donate%20%E6%89%93%E8%B5%8F/

原文http://www.ixirong.com/2015/05/17/how-to-build-ixirong-blog/

使用 github Pages 服務創建我的獨立博客全過程