HEXO個人部落格實現域名訪問
前言：
上一篇我們介紹了個人部落格的搭建，考慮到篇幅太長不利於閱讀，所以上一篇只完成了本地部落格的搭建。本文將會介紹如何將本地部落格同步到github以及繫結自己的域名，還會涉及一些基礎配置、主題的修改、以及接入第三方的一些工具。
準備：
首先需要註冊一個Github的賬號，註冊過程這裡不多說，然後建立一個Repository，並且命名：你的Github的名字.github.io ，這裡名字很重要不能亂取，要嚴格按照要求來。
建立好Github的Repository之後，我們開啟cmd命令工具，ping 你的Github的名字.github.io，這樣我們就可以得到對應的IP地址。註冊一個自己的域名，這裡我是在阿里雲上註冊購買的域名，以自己名字命名的，結尾優先使用.com或者.cn，如果被註冊了再使用其他的，看個人喜好吧。然後在阿里雲控制檯裡面配置域名解析到我們剛剛ping出的IP地址。
開啟阿里雲域名解析列表，如下圖：
點選需要解析的域名後面對應的“解析設定”按鈕，進入解析頁面，點選新增解析按鈕，新增對應的資料，如圖：
到這裡，我們就將域名和我們的Repository綁定了，接下來只需要將本地部落格同步到Repository就可以通過域名訪問了。
同步到Github：
找到之前建立的站點目錄下，用git命令clone之前新建的倉庫到本地，命令：
git clone https://github.com/你的github名字/你的github名字.github.io .deploy/你的github名字.github.iohexo generate
xcopy public /s .deploy/你的github名字.github.io
cd .deploy/你的github名字.github.io
git add .
git commit -m "update"
git push origin master站點主題配置：
愛美之心人皆有之，下面我們將介紹一下如何將我們的部落格修改得更酷一點。我們這裡主要使用的是NEXT模板關於NEXT可以到
在站點目錄下，執行git命令，載入next模板程式碼到本地。
git clone https://github.com/iissnan/hexo-theme-next themes/next站點配置：
找到站點目錄下的_config.yml檔案，開啟（這裡推薦使用MarkdownPad作為編輯工具MarkdownPad），設定站點的標題、作者、語言等。
# Site
title: Hexo部落格
subtitle: 新的開始
description: blog.fens.me
author: bsspirit
email: [email protected]
language: zh-Hans設定了中文需要將language設定成zh-Hans，具體語言表請看官網NEXT主題。有的發現設定了中文language，填寫的中文是亂碼，這是檔案編碼格式不對，將檔案另存為UTF-8格式，覆蓋原來的，就可以了。
主題配置：
找到HEXO站點目錄下的themes目錄下next目錄下的_config.yml主題配置檔案，找到並修改修改scheme屬性，選擇自己喜歡的外觀，這裡我選擇Mist主題。
# ---------------------------------------------------------------
# Scheme Settings
# ---------------------------------------------------------------
# Schemes
#scheme: Muse
scheme: Mist
#scheme: Pisces
#scheme: Gemini
在主題配置檔案裡面找到avatar配置，這裡是設定頭像的，配置好頭像地址就好了。
# Sidebar Avatar
# in theme directory(source/images): /images/avatar.gif
# in site directory(source/uploads): /uploads/avatar.gif
avatar: /uploads/head.jpg
在主題配置檔案裡面，找到menu設定，選擇需要的menu放出來：
menu:
home: / || home
#tags: /tags/ || tags
categories: /categories/ || th
archives: /archives/ || archive
#schedule: /schedule/ || calendar
#sitemap: /sitemap.xml || sitemap
#commonweal: /404/ || heartbeat
about: /about/ || user
# Enable/Disable menu icons.
menu_icons:
enable: true
原來預設有首頁和歸檔兩個標籤，這裡我放出了分類和關於兩個標籤，需要建立對應的index頁面。
分類頁面：在站點目錄下執行命令
hexo new page categorieshexo new page about站點底部配置：
找到\themes\next\layout\_partials下的footer.swig檔案，找到{% if theme.footer.powered %}、{% if theme.footer.powered and theme.footer.theme.enable %}、{% if theme.footer.theme.enable %}下的內容，可以對底部展示文字格式做調整，在\themes\next\languages資料夾下的zh-Hans.yml中找到footer關鍵字，可以對展示內容做修改。
footer:
powered: "怠惰是貧窮的製造廠"
theme: Never say die.社交連結配置：
在主題配置檔案中找到social配置，選擇自己需要的站點配置連結。
第三方功能接入：
評論系統：
這裡使用的gitment評論，點開連結gitment註冊， Authorization callback URL填寫自己的網站連結，記下Client ID和Client Secret。在主題配置檔案中找到Gitment配置
gitment:
enable: true
mint: true # RECOMMEND, A mint on Gitment, to support count, language and proxy_gateway
count: true # Show comments count in post meta area
lazy: false # Comments lazy loading with a button
cleanly: true # Hide 'Powered by ...' on footer, and more
language: zh-Hans # Force language, or auto switch by theme
github_user: # MUST HAVE, Your Github ID
github_repo: # MUST HAVE, The repo you use to store Gitment comments
client_id: # MUST HAVE, Github client id for the Gitment
client_secret: # EITHER this or proxy_gateway, Github access secret token for the Gitment
proxy_gateway: # Address of api proxy, See: https://github.com/aimingoo/intersect
redirect_protocol: # Protocol of redirect_uri with force_redirect_protocol when mint enabled在languages目錄下en.yml中新增：
gitmentbutton: Show comments from Gitmentgitmentbutton: 顯示 Gitment 評論{% elseif theme.valine.appid and theme.valine.appkey %}
<div id="vcomments"></div>{% elseif theme.gitment.enable %}
{% if theme.gitment.lazy %}
<div onclick="ShowGitment()" id="gitment-display-button">{{ __('gitmentbutton') }}</div>
<div id="gitment-container" style="display:none"></div>
{% else %}
<div id="gitment-container"></div>
{% endif %}{% if theme.gitment.enable %}
{% set owner = theme.gitment.githubID %}
{% set repo = theme.gitment.repo %}
{% set cid = theme.gitment.ClientID %}
{% set cs = theme.gitment.ClientSecret %}
<link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css">
<script src="https://imsun.github.io/gitment/dist/gitment.browser.js"></script>
{% if not theme.gitment.lazy %}
<script type="text/javascript">
var gitment = new Gitment({
id: window.location.pathname,
owner: '{{owner}}',
repo: '{{repo}}',
oauth: {
client_id: '{{cid}}',
client_secret: '{{cs}}',
}});
gitment.render('gitment-container');
</script>
{% else %}
<script type="text/javascript">
function ShowGitment(){
document.getElementById("gitment-display-button").style.display = "none";
document.getElementById("gitment-container").style.display = "block";
var gitment = new Gitment({
id: document.location.href,
owner: '{{owner}}',
repo: '{{repo}}',
oauth: {
client_id: '{{cid}}',
client_secret: '{{cs}}',
}});
gitment.render('gitment-container');
}
</script>
{% endif %}
{% endif %}然後在主題下layout/_third-party/comments/index.swig檔案中引入gitment.swig檔案：
{% include 'gitment.swig' %}#gitment-display-button{
display: inline-block;
padding: 0 15px;
color: #0a9caf;
cursor: pointer;
font-size: 14px;
border: 1px solid #0a9caf;
border-radius: 4px;
}
#gitment-display-button:hover{
color: #fff;
background: #0a9caf;
}@import "gitment";文末新增結束語：
在路徑 \themes\next\layout_macro 中新建 passage-end-tag.swig 檔案,並新增以下內容：
<div>
{% if not is_index %}
<div style="text-align:center;color: #ccc;font-size:14px;">
-------------本文結束
<i class="fa fa-paw"></i>
感謝您的閱讀-------------
</div>
{% endif %}
</div>
<div>
{% if not is_index %}
{% include 'passage-end-tag.swig' %}
{% endif %}
</div># 文章末尾新增“本文結束”標記
passage_end_tag:
enabled: true底部顯示訪問量：
開啟\themes\next\layout_partials\footer.swig檔案,在copyright前加上畫紅線這話：
script async src="https://dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"></script>
<div class="powered-by">
<i class="fa fa-user-md"></i><span id="busuanzi_container_site_uv">
本站訪客數:<span id="busuanzi_value_site_uv"></span>
</span>
</div>
新增百度統計，閱讀次數都可以在官網看到點選開啟連結，這裡不多說了。
本文在參考一些技術文章的基礎上實踐過，整理了相關流程，感謝相關分享的作者，這裡附連結：