必備工具:
1、coding 或者 github (這將是你博客的服務器)
2、Hexo 或者 jekyll (這是你博客的系統(tǒng),當然還有很多別的 可以自行百度/谷歌 :“靜態(tài)博客”)
3、git (這可是個很重要的玩意兒沒有這個你搞不定你的博客)
4、nodejs (這尼瑪也很重要)
5、sublime 或者 atom 或者 vscode 再不濟 你就 記事本吧!(這玩意重不重要 其實還好,主要是用來寫 博客的,就是個編輯工具,當然 如果你是個碼農 那你一定認識它們真正的作用,這些軟件的官網都是 鷹語哦 看不懂的 請時刻 有道)
在這篇教程里面,我們選擇使用coding提供的 coding page服務 和 Hexo 博客系統(tǒng)
有人說:為啥不選 github?
A:為了照顧一些 英語捉急的朋友,還有就是 這里是 China 所以github 有時候不穩(wěn)定。
又有人說:為啥不選 jekyll 博客系統(tǒng)
A:我樂意 咋滴 不服? 你來咬我呀~我就高興選擇 Hexo,我才不會告訴你jekyll 我自己都還沒用過因為我嫌棄 它 前期需要安裝的東西太多
OK. 話不投機半句多,哦不,是話不多說,正式開始
Step 1:
首先 讓我們打開 coding的網站: coding.net,然后注冊一個賬號。(這個總會吧?不需要我一個個截圖給你演示吧?這個再不會的話,你就不用往下看了,后面的內容會 超過你的智商上限的)
Step 2:
注冊完之后 我們點擊左側的項目菜單進入 項目頁面
我們 對應填入 項目名稱和項目描述, 后面的你都不用管 不過 免費的 coding用戶只能最多創(chuàng)建5個私有項目,所以 建議選擇 公開,反正也沒人會吃飽了撐的 去動你的 項目的,Trust Me
創(chuàng)建完之后 你的博客的 服務器部分 的 第一階段 算是完成了。。。
怎么樣 很簡單吧?別急,還沒完全結束呢,我們之后還要回來的。。。
Step 3:
在一開始的時候 我記得有 提到過 git
* 如果你是mac,辣么恭喜你,你已經預裝了git了,如果沒有裝的話 就去官網上 下載安裝吧
* 如果你是win,辣么乖乖去官網下載安裝
在一開始的時候 我也提到過 nodejs
辣么,不管你是win還是mac,請你們都去官網下載安裝 系統(tǒng)對應的 最新版本吧
git和node的官網都是全英文的 不過。。。只是 下載 的話 這點程度的英文 你再不懂的話 你還是別往下看了會超出你的智商上限的。。。實在不懂但又想繼續(xù)的。。。辣么。。。隨時準備 有道 吧。。。
Step 4:
都已經到這一步了,git 裝好了吧?node裝好了吧?你們的編輯工具 下載好了么?安裝好了嗎?
What? 你說還沒有?好吧 那你到這里可以暫停了,等待它(們)下載安裝完吧。。。
那么,已經安裝好了的朋友們,我們繼續(xù)。。。
mac的朋友們打開你們的 Terminal(終端),win的朋友們打開你們的 cmd
然后你們的瀏覽器 打開 快戳我: https://hexo.io/zh-cn/docs/index.html 這個頁面
在你電腦中你 看著順眼的位置 新建一個文件夾 給它個名字,然后在你的 Terminal / CMD 中 使用命令指向到 這個文件夾 "cd 你的文件夾路徑" 然后你就根據 上面這個頁面中的 步驟 安裝 hexo 命令,
安裝完之后 https://hexo.io/zh-cn/docs/setup.html 再根據這個頁面的 介紹 安裝 hexo系統(tǒng)
然后 我們再執(zhí)行
npm install hexo-deployer-git --save
這個命令 安裝 你博客的發(fā)布工具
辣么 恭喜你 到此 你的博客系統(tǒng)已經安裝完畢了!是的呢,看上去辣么多文字,其實 實際操作起來 賊TM簡單
Step 5:
OK 到這一步了就很簡單了。。。對你的hexo 系統(tǒng)進行一些簡單的配置
用你剛才安裝的 編輯工具 打開 hexo系統(tǒng) 所在的文件夾(別告訴我你忘了裝哪了,那么就去屎吧)
找到最外面的 _config.yml 文件 并打開它,
我們看到 有這么幾項: title subtitle description author language timezone
我們一個個介紹
title: 博客的名字
subtitle:副標題
description:博客的描述(這個影響seo)
author:作者
language:博客的主語言
timezome:時區(qū)
現在 我們回到 coding里剛才新建的項目里面
現在我們回到 編輯器里 _config.yml文件 拉到底下 找到 deploy
一開始 deploy 里只有type 這一項,另外兩項需要自己補充
type:類型 填 git
repo:git地址 (就是剛才讓你復制的那個 地址)
branch:分支 填 master
ok 完成了!
開始寫你的第一篇博客吧
我們回到 Terminal / cmd 里面
輸入 hexo new 測試
然后 回到編輯器,你會發(fā)現 在 source 文件夾下 出現了一個 _posts 文件夾, 里面多出了一個 叫 測試.md 的文件
雙擊打開 測試.md 文件
tags 這里是文章的標簽 添加你想要的 標簽
這么寫
然后在 tags 下面的 三個橫杠 下面 就是你博文的正文了,
不過 hexo寫作是用的 markdown形式,如果你不懂 markdown 沒關系,很簡單 百度一下就行了,markdown 很容易上手 而且寫作速度也很快(如果你還懂點 html 那你就無敵了,markdown滿足不了的時候 你就可以直接添加 html標簽)
預覽
假設 現在 你已經寫完了你的博文了,我們如何預覽呢?
回到Terminal / cmd 中 看看 是不是還是指向在 hexo系統(tǒng)所在的 目錄,如果不是 請人工指向過來 然后 輸入 hexo s
然后等待
直到 Terminal / cmd 中 出現如下文字
INFO Start processing
INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop
如果沒有出現上述文字 說明出錯了,具體為什么 我們啥時候有空再說 或者在文后留言
然后我們在 瀏覽器 地址欄中 輸入
localhost:4000
看!你的博客和博文出現了!檢查一下 沒問題的話 我們就要準備正式發(fā)布了!
發(fā)布
假設 現在 你已經檢查完博文了,那么如何發(fā)布呢?
假設你已經完全按照我上述的步驟 一個沒錯 一個沒跳過的 做了
好了 接下來 我們要發(fā)布文章了,
回到Terminal / cmd 中 看看 是不是還是指向在 hexo系統(tǒng)所在的 目錄,如果不是 請人工指向過來
然后 輸入 hexo g -d
然后 會要求你 輸入 你的 coding的登錄用戶名和密碼
按要求填入之后 發(fā)布就完成了
開啟我們的博客
僅僅完成上述步驟 我們還不能讓我們的博客在 公網上 被訪問到,我們還有最最關鍵的一步沒有做
現在回到coding的頁面,在我們剛建的那個項目
我們看到有個 pages服務
?。。。?/span>
我們可以看到如下內容
我們先選擇部署來源 選 master分支
然后直接點 保存
然后就會出現
Coding Pages 已經運行在 httpXXXXXXXX
的提示,我們點擊 這個 鏈接 就會打開我們的 博客啦!
驚不驚喜?刺不刺激?
如果你不滿足于 coding給你的域名 那么你可以自己花錢 去買一個域名 然后 填入到 自定義域名中去,具體的步驟 看自定義域名 里面的 查看幫助
OK 至此 你的免費的博客完成了,
但是 界面都是千篇一律啊 我想要一點自己的風格。腫么辦?!
戳我!
選一個 你喜歡的主題
然后 進入到你的 terminal/cmd 只想到你的 hexo文件夾
使用
git clone xxxxxxxx theme/xxx
命令下載下來主題,然后在最外層的 _config.yml 中 找到 theme 把 landscap 改成你剛下的主題的文件夾名字就OK了。。。
任何修改之后 都不要忘記
hexo g -d
深圳網站建設博納網絡編輯整理