基於hugo + github 創建我的博客

目錄

• 基於hugo + github 創建我的博客
  • 1.本地測試
    • 1.1安裝
  • Getting started
    • Installation
    • 1.2 寫文章
  • 2.部署到github的倉庫
  • 總結

基於hugo + github 創建我的博客

ps: 之後的博客可能就丟github了，記錄博客搬遷，博客園對於一些圖片添加又想用markdown的時候就不太方便了

1.本地測試

1.1安裝

先在本地搭建試一試吧！我使用的是deepin版的linux

咱們去github上的官網找下載連接https://github.com/gohugoio/hugo/releases

我下載了64bit的deb包，而後安裝sudo dpkg -i hugo_0.55.6_Linux-64bit.deb

安裝完成～

我在文檔中創建一個文件夾，在這裏面進行hugo的測試

cwl@cwl-PC:~/Documents/blogtest$ pwd
/home/cwl/Documents/blogtest

初始化博客

cwl@cwl-PC:hugo new site [myblog] "後面的myblog是可選的"

...

cwl@cwl-PC:~/Documents/blogtest$ tree
.
└── myblog
    ├── archetypes
    │   └── default.md
    ├── config.toml
    ├── content
    ├── data
    ├── layouts
    ├── static
    └── themes

這樣其實博客已經起來了，咱們須要設置個主題

咱們來到了官方主題庫https://themes.gohugo.io/

咱們隨便進入一個主題，其實怎麼用已經很清楚了

Getting started

Installation

Create a new Hugo site:

$ hugo new site [path]

Clone this repository into themes/ directory:(注意這裏是在博客根目錄敲clone)

$ cd [path]
$ git clone https://github.com/vaga/hugo-theme-m10c.git themes/m10c

Add this line in the config.toml file:

theme = "m10c"

而後咱們去啓動下試一試

hugo server -t m10c --buildDrafts

而後就起來了。

1.2 寫文章

hugo new [path/xxx.md] "簡單使用

2.部署到github的倉庫

首先建立新倉庫，注意倉庫名必須是 [ 你的名字.github.io ] . 例如github名叫abc。那麼就寫abc.github.io

剩下常規建倉庫就不講了。

而後敲命令

hugo --theme=m10c --baseUrl="Q1143316492.github.io" --buildDrafts

敲完後能夠看到咱們多了一個public文件夾

cwl@cwl-PC:~/Documents/blogtest/myblog$ hugo --theme=m10c --baseUrl="Q1143316492.github.io" --buildDrafts

                   | EN  
+------------------+----+
  Pages            |  7  
  Paginator pages  |  0  
  Non-page files   |  0  
  Static files     |  1  
  Processed images |  0  
  Aliases          |  3  
  Sitemaps         |  1  
  Cleaned          |  0  

Total in 10 ms
cwl@cwl-PC:~/Documents/blogtest/myblog$ ls
archetypes  config.toml  content  data  layouts  public  resources  static  themes
cwl@cwl-PC:~/Documents/blogtest/myblog$ ls -l
總用量 36
drwxr-xr-x 2 cwl cwl 4096 6月   8 18:24 archetypes
-rw-r--r-- 1 cwl cwl   82 6月   8 18:24 config.toml
drwxr-xr-x 2 cwl cwl 4096 6月   8 18:24 content
drwxr-xr-x 2 cwl cwl 4096 6月   8 18:24 data
drwxr-xr-x 2 cwl cwl 4096 6月   8 18:24 layouts
drwxr-xr-x 6 cwl cwl 4096 6月   8 18:47 public
drwxr-xr-x 3 cwl cwl 4096 6月   8 18:26 resources
drwxr-xr-x 2 cwl cwl 4096 6月   8 18:24 static
drwxr-xr-x 3 cwl cwl 4096 6月   8 18:26 themes

下面咱們須要吧這個public文件夾傳到咱們的git上面便可

cwl@cwl-PC:~/Documents/blogtest/myblog$ cd public/
cwl@cwl-PC:~/Documents/blogtest/myblog/public$ ls
404.html  avatar.jpg  categories  css  index.html  index.xml  page  sitemap.xml  tags

cwl@cwl-PC:~/Documents/blogtest/myblog/public$ git init
已初始化空的 Git 倉庫於 /home/cwl/Documents/blogtest/myblog/public/.git/

cwl@cwl-PC:~/Documents/blogtest/myblog/public$ git add *

cwl@cwl-PC:~/Documents/blogtest/myblog/public$ git commit -m "hugo first submit"


"直接push發現不能夠，那就push到master
cwl@cwl-PC:~/Documents/blogtest/myblog/public$ git push
fatal: 當前分支 master 沒有對應的上游分支。
爲推送當前分支並創建與遠程上游的跟蹤，使用

    git push --set-upstream origin master

cwl@cwl-PC:~/Documents/blogtest/myblog/public$ git push -u origin master

到這裏就能夠用 "abc.github.io"訪問了，abc是你的名字

總結

• hugo new site [myblog] "後面的myblog是可選的"初始化博客
• 而後咱們能夠下載主題，怎麼安裝在主題的網站寫的很清楚，也能夠看我上面的get start
• hugo server -t m10c --buildDrafts 這樣是在本地開倉庫

• hugo new post/first.md 寫博客, 建立了一個md在context目錄下

• hugo --theme=m10c --baseUrl="Q1143316492.github.io" --buildDrafts 這個能夠開啓遠程倉庫

  這個命令在本地博客目錄加了一個public目錄。咱們只要把他同步到遠程git倉庫便可。

  這一步只是利用了github爲每個用戶提供的免費倉庫提供的我的網站

emmmmmmmmm，博客能用了，可是好像不咋好看呢。。。

我缺一個能寫markdown還能方便粘圖片的網站。。。