免费博客方案:hugo+cloudflare
将hugo部署到cloudflare
部署hugo
下载hugo
下载地址
hugo有两个版本,标准版和扩展版,扩展版在标准版基础上增加了对 Sass/SCSS 等预处理语言的支持。我这里选择了windows的extend
解压后,在目录下运行cmd
创建新站点
hugo new site newsite
将创建一个名为 newsite 的目录,并进入该目录下,将hugo.exe复制到该目录,或者改全局变量,不然无法执行hugo的命令,之后的命令都在该目录下执行
下载主题
到主题下载,我这里下载的是PaperMod
编辑newsite目录下的hugo.toml
theme = "PaperMod"
新建文章
hugo new posts/hello world.md
draft: ture代表草稿文件,改成false代表正式发布
添加标签
tags = ['markdown','blog']
本地预览
hugo server -D
-D代表输出包括标记为 draft: true 的草稿文章
到浏览器输入127.0.0.1:1313进行访问
构建网站
预览觉得没问题后,构建网站生成静态文件
hugo -D
将自动创建public目录,该目录需要上传至cloudflare
更多配置
新建about页面
在content目录下新建about.md
+++
title = "关于"
layout = "about"
url = "/about/"
summary = "about"
+++
# 欢迎来到我的小站
这个站点主要做个备份
新建归档页面
在content目录下新建archives.md
+++
title = "归档"
layout = "archives"
url = "/archives/"
summary = "archives"
+++
新建标签页面
hugo new tags/_index.md
自定义配置
# 基本配置
baseURL = 'https://example.com/' //域名
languageCode = 'zh-cn' //中文
title = 'site' //站点名称
theme = "PaperMod" //主题名称
paginate = 10 //首页每页显示的文章数
# 参数配置
[params]
description = "This is my personal website"
author = "qiaoqiao" //作者名
defaultTheme = "auto" //默认主题颜色
ShowToc = true //显示目录
TocOpen = false //目录默认是否展开
ShowWordCount = true //字数统计
ShowReadingTime = true //阅读时间
comments = false //全局评论
# 菜单配置
[menu]
[[menu.main]]
name = "🏡Home"
url = "/"
weight = 1
[[menu.main]]
name = "📄归档"
url = "/archives"
weight = 2
[[menu.main]]
name = "✒️文章"
url = "/posts/"
weight = 3
[[menu.main]]
name = "📌tags"
url = "/tags/"
weight = 4
[[menu.main]]
name = "👁️🗨️About"
url = "/about/"
weight = 5
# 自定义首页显示内容
[params.homeInfoParams]
Title = "Welcome to My Blog"
Content = "This is my personal blog where I share my thoughts and ideas."
logo设置
logo.ico上传到static/images目录下,默认会被PaperMod识别加载
上传cloudflare
将生成的public文件夹上传
配置域名
配置的域名需要托管在cloudflare下
直接访问自定义的域名,cloudflare自动配置了https,完成
License:
CC BY 4.0