GitHub Pages架設靜態網站

1.架設工具介紹

1.1工具介紹

Github介紹?

Github是一個透過Git進行版本控制的code放置平台

GitHub Pages介紹?

GitHub Pages是把你上傳的html程式碼轉換成網站

Desktop介紹?

Github Desktop 是讓你更方便的上傳程式碼到Github上

Hugo介紹?

可以快速的產生個人網站程式碼

1.2申請GitHub帳號跟下載Github Desktop與Hugo

GitHub官網

GitHub Desktop官網

Hugo官網

Hugo下載

1.3建立一個新的repository

Repository name 要填 [github帳號].github.io，然後按 [Create Repository] ，使用Github Desktop下載repo到本地。

從零開始: 用github pages 上傳靜態網站

Git 與 Github 版本控制基本指令與操作入門教學

1.4 Hugo下載自己喜歡的主題

Hugo主題

1.5 Hugo基本操作

• 將exampleSite資料夾移至桌面，內新增themes資料夾，後將主題資料夾的檔名-master刪掉放入themes內。

• 在exampleSite開啟cmd，輸入hugo server，將下方網址，例如 : http://localhost:1313/，複製貼到瀏覽器中打開。

• 在exampleSite開啟cmd，輸入hugo ，會增加public資料夾，將裡面的檔案複製到本地的repo檔中，後push上GitHub。

2.文章撰寫

2.1Markdown 介紹?

• 是目前非常普遍用來撰寫文檔的語言，一開始的目 標就是使用「易讀易寫的純文字格式編寫文件」。

Markdown文件

2.2Hugo Shortcodes介紹?

使用Markdown撰寫文章後，Hugo有而外對文章支持，就是Hugo Shortcodes，可以插入YouTube影片，Twitter，instagram在文章裡。

3.補充功能

3.1 google search console介紹?

Google Search Console 是 Google 提供的一項免費服務，能夠協助您監控及維持網站在 Google 搜尋結果中的排名，並排解相關問題。即使未申請 Search Console，您的網站仍可能會顯示在 Google 的搜尋結果中，但 Search Console 有助您瞭解並改善 Google 查看您網站的方式。

Google Search Console 初學者指南

Search Console 教學

3.2 google adsense介紹?

AdSense 是一項免費服務，可讓您輕鬆地在自己的線上內容旁刊登廣告，向網站訪客顯示吸引人的相關廣告來賺取收益。您甚至還能配合網站自訂廣告的外觀和風格。

google adsense 教學