Github Page

#Github page

---

Environment：Windows 10 with WSL (Ubuntu 20.04 LTS)
Theme: lanyon

Step I: Setup

1. sudo apt install ruby ruby2.7-dev

2. sudo apt install make

3. sudo gem install jekyll jekyll-gist jekyll-sitemap jekyll-seo-tag jekyll-paginate

   doc

4. git clone git@github.com:lbwei1016/lanyon.git

   這是從官方 fork 過來的

5. git remote add github.io [github.io repo url]

6. git add . && git commit -m "init"

7. git checkout gh-pages

8. git branch --set-upstream-to=github.io gh-pages

9. git push -u github.io gh-pages

Step II: Deploy

1. 到 github.io repo，按下 Settings。

2. 右方選擇 Pages，然後變更 source 為 gh-pages。完成！

Step III: Play

Github 部署網頁需要花一些時間，所以只有本地才能即時看到變更。

• jekyll serve: run at localhost:4000

1. 官方文件：Jekyll setup

2. Liquid

   • Liquid 語法不論在 .html 或 .md 都可以使用

3. Layout / include：事先定義模板方便重複使用

   • 兩者層級不同

4. Post / Blogging

   • 檔名必須為 2022-06-21-example.md 此格式

   • 可改為使用自定義 Collections

     posts 是預設的 collection

5. Collections

   • 將頁面分類

   • e.g.

     # 指定 collections 路徑
     collections_dir: my_collections 
     collections:
         math:
            label: math
            # true，這個 collection 的 pages 才會存放至 _site/ 內
            output: true
         misc:
            label: misc
            output: true
     

     • 指定路徑後，_posts 也必須移至該目錄下
     • _site/ 內的檔案就是實際在網頁上能看到的
       • Jekyll: the _site folder

6. Variables

   • Variables

7. MathJax

   • MathJax

Google Analytics

前置：去 GA 設定，開新的串流。

先去 _config.yml 修改 google_analytics_id，再到 _includes/head.html 的尾端（</head> 後）加上從 google analytics 複製來的 script：

就完成了！

Note

如果不會自動更新頁面，試 jekyll serve --force-polling。

如果 localhost:4000 跑不出畫面，試 jekyll server --port 5000。