天天看點

Mac下使用Jekyll和github搭建個人部落格

<a href="#0-%e9%93%be%e6%8e%a5">連結</a>

<a href="#1-%e5%ae%89%e8%a3%85ruby">安裝ruby</a>

<a href="#2-%e5%ae%89%e8%a3%85gem">安裝gem</a>

<a href="#3-%e5%ae%89%e8%a3%85jekyll">安裝jekyll</a>

<a href="#4-%e5%ae%89%e8%a3%85%e5%8d%9a%e5%ae%a2">安裝部落格</a>

<a href="#5-%e6%9c%ac%e5%9c%b0%e5%90%af%e5%8a%a8%e5%8d%9a%e5%ae%a2">本地啟動部落格</a>

<a href="#6-%e9%83%a8%e7%bd%b2%e5%88%b0github">部署到github</a>

<a href="#7-%e6%b7%bb%e5%8a%a0%e6%96%87%e7%ab%a0">添加文章</a>

<a href="#8-%e4%bd%bf%e7%94%a8%e4%b8%bb%e9%a2%98">使用主題</a>

<a href="#9-%e7%bb%91%e5%ae%9a%e5%9f%9f%e5%90%8d">綁定域名</a>

<a href="#10-about">about</a>

<a href="http://alex-my.xyz/web/mac%e4%b8%8b%e4%bd%bf%e7%94%a8jekyll%e5%92%8cgithub%e6%90%ad%e5%bb%ba%e4%b8%aa%e4%ba%ba%e5%8d%9a%e5%ae%a2" target="_blank">http://alex-my.xyz/web/mac下使用jekyll和github搭建個人部落格</a>

mac自帶, 沒有則使用brew安裝

我機子上也是自帶的, 或許曾經安裝過。沒有gem的參考以下網站:

<a href="https://rubygems.org/pages/download" target="_blank">https://rubygems.org/pages/download</a>

如果安裝好了gem, 建議更換為國内的源

輸入gem –version檢視版本号。對比下官網的版本。可以使用以下指令更新

首先需要安裝bundler

否則會報錯:

我還裝了以下這些

建立部落格,如果沒有找到jekyll指令,請重新開機終端。

安裝過程會顯示一堆安裝的内容,最後一行:

進入到安裝目錄

輸出:

(add 2017.3.1)

後來運作 jekyll serve的時候報錯:

可以通過以下指令解決:

在執行gem install bundler的時候又報錯了。檢視了下, /usr/bin/bunder不存在, 而是存在/usr/local/bin/bunder

是以,用以下代碼代替:

然後就正常了。

我的使用者名為alex-my,要按照username.github.io建立一個倉庫

是以,我建立了一個alex-my.github.io的倉庫

得到位址

進入到本地, 将本地的内容和github尚的倉庫關聯

注意替換為你自己的位址,在執行git push的時候,需要你輸入github的賬号和密碼。

文章都放在_posts目錄下面,按照格式年-月-日-文章名.markdown

在_posts下建立檔案:

檔案開頭需要參照預設的那篇:

title: 文章标題

date: 顯示日期

categories: 标簽分類

文章完整内容如下:

使用指令推送,我是使用phpstorm這個ide的。

浏覽器輸入alex-my.github.io,就可以看見這篇文章了。

或者輸入域名 alex-my.xyz,也就是本部落格所在。

本部落格使用插件來分類categories和tags,但是,github出于安全的考慮,會禁止插件運作。

這也就是網上很多人提到的,本地運作好好的,一旦推送到github後,就顯示404。

為了解決這個問題,本部落格倉庫用了master和source兩個分支。主分支master存放執行jekyll build後_site目錄下的内容。source分支存放平常開發,撰寫文章所用。

具體可以檢視source分支下的makefile檔案。

本主題将文章中的categories當做是導航欄目

将文章中的tags當做是language的下拉菜單

也可以混合一起

以上設定可以參看 <code>_includes/nav.html</code> 中的設定。

在終端輸入:

得到ip位址:

打開域名供應商的控制台, 我這邊在萬網申請的xyz域名。

添加解析, 添加兩條a記錄:

記錄值填寫剛才獲得的ip位址。

在部落格根目錄添加cname檔案,并将你的域名寫入:

将cname送出。待域名解析完成,就可以了。萬網這邊1分鐘解析時間。

<a href="http://alex-my.xyz">alex-my.xyz</a>

<a href="http://blog.csdn.net/alex_my">blog.csdn.net/alex-my</a>

繼續閱讀