全免費GitHub Pages建站方法

時間：2023-08-01 00:00:01 | 來源：網(wǎng)站運營

時間：2023-08-01 00:00:01 來源：網(wǎng)站運營

全免費GitHub Pages建站方法：我有一期相關的視頻發(fā)布了，但是竟然有人提議說不直觀……那好叭，上圖文教程！

一切的一切都不是從github開始！

從這個軟件開始：

直接附上下載鏈接，不多說。軟件里面引導很全面，也不必多說。只不過訪問github網(wǎng)站的時候記得打開系統(tǒng)代理。

1.打開軟件，根據(jù)提示安裝根證書，點擊左側大按鈕開啟。（當然有時候這個軟件會起反作用，但是自己試試就知道了）

2.然后打開瀏覽器，訪問github官網(wǎng)。

自行注冊驗證郵箱并登錄，全程有向導，不必多說。

3.進入主頁，點擊左上角列表上方綠色的的“new”按鈕。

4.設置都不要動，只是在“Repository name”框中輸入你想要的存儲庫名稱（網(wǎng)址二級目錄名，不要用中文，不然容易出錯），下面的長框框是存儲庫名稱，可選填。然后直接劃到最下面，點擊綠色的“Create epository”按鈕。

完了以后進入這個頁面：

5.這時，下載“Github Desktop軟件”，登錄。然后點擊“file”，點擊“Clone repository”。附上下載鏈接：

6.找到我們剛剛創(chuàng)建的存儲庫名稱，選好本地目錄，點擊“clone”。

7.克隆完成長這樣

8.點擊右側的“Show in Explorer”就能在資源管理器里面看到克隆的存儲庫啦?。ㄗ⒁猓锩娴摹?git”文件夾千萬不能刪，或者直接在默認代碼編輯器打開也可以，這里的第一個大項，我的默認代碼編輯器是vscode）

9.右鍵新建文本文檔，重命名為index.html（一定是這個名字，這是主頁，瀏覽器訪問域名默認訪問的就是這個頁面），在里面寫好html代碼。我這里就寫的簡單一些?？梢杂糜浭卤揪庉?，但是最好用Vscode。

10.編輯代碼，保存。附上VScode下載鏈接：

11.雙擊打開剛剛創(chuàng)建的文件，測試網(wǎng)頁（或者直接在代碼編輯器按下f5）。

12.確認網(wǎng)頁無誤時，回到Github Desktop。軟件會自動檢測到你剛剛增加的文件和更改的代碼。綠色代表增加，紅色代表刪除，黃色代表更改。

一般情況下軟件會自動為你創(chuàng)建提交名稱。但是有時候不會，所以就要你自己加個提交名稱啦~（位置為左下角“Create index.html”編輯框的位置）

13.完事以后“commit to main”按鈕會亮起，點擊這個藍色的按鈕。稍等片刻，等待“Publish Branch”按鈕亮起，點擊這個按鈕。

稍等片刻，等待文件提交到存儲庫。如果“publish branch”菜單沒有消失，就再試一次，直到消失為止。

提交完成大概長這樣：

14.回到github網(wǎng)站，刷新一下我們剛剛提交的一個文件出現(xiàn)了。

這時候如果你心情好，可以添加一個“readme”的文件介紹一下自己的存儲庫。

15.點擊工具欄的“Settings”，點擊左側的“pages”，Branch項下拉選擇“main”，點擊右側的“save”。

16.當最上方出現(xiàn)橫幅提示“GitHub Pages source saved.”時，稍等片刻。

17.你可以在“actions”選項卡查看頁面構建進度。圖標由旋轉的黃點變?yōu)榫G色的“√“時，頁面構建就完成了。

18.返回到“pages”設置頁面，手動刷新頁面，看到“Your site is live at……”提示，后面的藍色字網(wǎng)址就是你的網(wǎng)站網(wǎng)址。點擊右側的“Visit site”即可訪問你剛剛編輯的網(wǎng)頁在線版。

訪問效果：

以后更新網(wǎng)站，就只需要重復第8-13步就可以啦！提交完文件以后，稍等頁面構建片刻（可以用第17步的方法查看進度）就能看到自己的網(wǎng)站更新啦！

不過還是要有幾點注意的：

1。單個文件不得大于100MB

2。不能創(chuàng)建非法網(wǎng)站

3。github pages配置帶寬比較低，所以不要使用過大的圖片，可能會需要很長時間加載，影響體驗。所以盡量使用小一點的圖片。推薦一個圖片壓縮網(wǎng)站。

順便說一下，這個工具來自即時工具，這是一個全免費的超全面國內(nèi)電腦在線小工具網(wǎng)站！

好啦，感謝您看到這里！那么本期文章就到這里，下期再見，拜拜┏(＾0＾)┛！

博主是未成年人，碼字或技術有錯誤敬請多多指教，謝謝！希望您可以給個贊同、喜歡、收藏、關注，鼓勵一下，萬分感謝！您的支持是博主最大的更新動力！