用html製作個人博客,博客製作教程

第一章

介紹一個開源的個人博客框架hexo,展示如何使用它快速搭建個人博客,並發布到github

準備

  • Node環境
  • Git工具
  • GitHub賬號

搭建

1.下載

npm i -g hexo-cli

2.初始化

hexo init

命令執行時會自動下載一個默認主題,這樣一個初始化的博客網站就搭建成功了,接下來就可以啟動了。

3.啟動

hexo s

啟動成功後,打開瀏覽器,訪問提示端口

一種快速搭建個人博客網站的方式

第二章

寫博客

利用命令行或者手動創建,這裡講一下命令行

進入控制台,切換到 source/_posts/ 目錄下

cd source/_posts/

1.新建

hexo n "名稱"

執行完成後,就會在source/_posts/下生成一個文件

一種快速搭建個人博客網站的方式

2.使用markdown編輯器編輯好內容,保存退出!

3.先清除

hexo clean

再生成

hexo g

4.最後再次啟動

hexo s

就可以看到自己寫的博客了

一種快速搭建個人博客網站的方式

更換主題

自定義一個主題

推薦:
https://github.com/litten/hexo-theme-yilia
,一個優雅簡潔的主題

1.下載

blog/下進入控制台

git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

會將主題下載到目錄文件夾themes/下

一種快速搭建個人博客網站的方式

2.修改配置

下載完成後,修改配置文件_config.yml,將theme換成自己要換的主題名

一種快速搭建個人博客網站的方式

3.保存退出之後再先清除

hexo clean

再生成

hexo g

4.啟動

效果

一種快速搭建個人博客網站的方式

發布

到目前為止,我們創建的博客只能在本地運行,只能本地主機訪問,這樣的博客網站是沒有任何意義的,因此,我們要將它發布到服務器上,這裡我們採用一個免費的方式,將它發布到github上

1.創建倉庫

點擊加號後,選擇new repository

一種快速搭建個人博客網站的方式

注意:新建的倉庫名必須是:登錄名+github.io

一種快速搭建個人博客網站的方式

2.安裝插件

hexo-deployer-git:用將博客網站發布到遠端的插件

切換到blog/下,進入控制台

3.修改配置文件

打開_config.yml,找到最底修改為

一種快速搭建個人博客網站的方式

4.發布

控制台

刷新再進入到剛剛創建的倉庫,我們就可以看到上傳很多文件

一種快速搭建個人博客網站的方式

這樣我們可以直接使用倉庫名進行訪問,例如:

我這裡使用:http://chenhr24.github.io訪問

一種快速搭建個人博客網站的方式

結語

本文給大家介紹了一種快速搭建個人博客網站的方式,並將博客網站發布到GitHub上。當然,這裡只是使用了hexo搭建一個建議的網站,如果想要做的更加美觀,可以之後再做完善!

大家可以花幾十分鐘試着創建一個自己的博客網站,遇到什麼問題歡迎評論區留言討論!!

原創文章,作者:投稿專員,如若轉載,請註明出處:https://www.506064.com/zh-hant/n/230121.html

(0)
打賞 微信掃一掃 微信掃一掃 支付寶掃一掃 支付寶掃一掃
投稿專員的頭像投稿專員
上一篇 2024-12-10 13:18
下一篇 2024-12-10 13:18

相關推薦

發表回復

登錄後才能評論