hugo博客搭建

发表于： 分类于：
字数： 1256 阅读：≈ 3分钟 浏览：

hugo博客搭建超详细教程

hugo主题选择

  1. 如果E:\Project\Blog\ZER0-blog\public\img\author.jpg 和 http://localhost:1313/img/author.jpg 访问的图片不一致，可能是因为图片缓存 浏览器可能缓存了旧版本的图片，导致显示的图片与实际文件不一致。尝试以下步骤清除缓存： 强制刷新：按 Ctrl + F5（或 Cmd + Shift + R 在 macOS 上）强制刷新页面，确保加载最新的资源。

  2. 想要让自己首页home目录下显示东西，应该修改的是/layouts/index.html，这可能是hugo到时候解析会把这个放在首页

  3. 想要换背景图片，主要是修改/layouts/index.html和/layouts/_default/baseof.html

  4. 搭建博客时要修改文件路径，这里可以用windows-powershell中的功能,直接替换字符（但前提是你之前本地笔记都很规整。发现photos目录会因为这个操作图片被损坏，但是无所谓了，注意提前备份就行）

$folderPath = "C:\Users\ZP\Desktop\PWN3"
$searchPattern = "*.*"

Get-ChildItem -Path $folderPath -Recurse -Include $searchPattern | ForEach-Object {
    try {
        # 读取文件内容，使用 UTF-8 编码
        $content = Get-Content $_.FullName -Raw -Encoding UTF8 -ErrorAction Stop
        # 替换 /photos 为 /img/photos
        $content = $content -replace "/photos", "/imgs/photos3"
        # 写入文件内容，使用 UTF-8 编码
        $content | Set-Content $_.FullName -Encoding UTF8
    }
    catch {
        Write-Host "无法访问文件：$($_.FullName)" -ForegroundColor Red
    }
}
  1. 本地笔记都没有Hugo的前缀，这里可以用这个脚本一键递归地给文件夹中所有markdown文件添加前缀
import os
from datetime import datetime

# 模板内容
template = '''---
title: "{title}"
description: ""
keywords: ""

date: {date}
lastmod: ""

categories:
  - "PWN3"
tags:
  - "pwn"
---


'''

def process_markdown_file(file_path):
    file_name = os.path.splitext(os.path.basename(file_path))[0]
    formatted_template = template.format(title=file_name, date=datetime.now().strftime('%Y-%m-%d'))

    with open(file_path, 'r', encoding='utf-8-sig') as file:
        content = file.read().lstrip('\ufeff')

    if content.startswith('---'):
        print(f"Skipping {file_path} as it already contains front matter.")
        return

    new_content = formatted_template + content

    with open(file_path, 'w', encoding='utf-8') as file:
        file.write(new_content)

    print(f"Processed {file_path}")

def process_directory(directory):
    for root, dirs, files in os.walk(directory):
        for file in files:
            if file.endswith('.md'):
                file_path = os.path.join(root, file)
                process_markdown_file(file_path)

if __name__ == "__main__":
    directory = r"C:\Users\ZP\Desktop\PWN3"
    process_directory(directory)
  1. 发现分类统计数目不对，发现config.yaml有这个内容，如果把所有文件都放在/contents/post目录下，那么存档这个文件夹就会正确地写入东西，又发现了一个问题，这里的分类标题都被大写了，所以有的计数对有的不对，做了以下尝试
params:
  # 需要显示文章的部分，即content目录下的文件夹名称
  # Sections for show in home & archive page 
  # and it's forlder name which under content
  mainSections: ["posts"]
  # 年，月，日及时间的格式化样式
  # Format style for year,month,date & time
  yearFormat: "2006"
  monthFormat: "01-02"
  dateFormat: "2006-01-02"
  timeFormat: "2006-01-02T15:04:05-07:00"
  • 询问gpt说可能是因为CSS处理的时候有uppercase这个函数处理了大写,用如下命令查找有这个uppercase的，发现结果也太多了，根本不知道可能是哪个文件进行了哪个处理
Get-ChildItem -Path "E:\Project\Blog\ZER0-Blog\" -Recurse | Select-String -Pattern "font-size" | Out-File -FilePath "E:\res.txt"
  • 不管怎么搜都搜不到，最后用如下搜索hugo Next处理categories和tags会大写，搜到一篇不错的 这篇博客

  1. 如果没有正确写入categories和tags内容，本地搜索功能会受到影响

  2. 再次push到远程

# git remote remove origin
git init -b main
git remote add origin git@github.com:zp9080/zp9080.github.io.git
git add .
git commit -m "Commit all local changes"
git push origin main --force
  1. 想要设置代码的大小比正文小，我这个hugo-next-theme还不支持用config.yaml设置，要在E:\Project\Blog\ZER0-Blog\assets\css_common\components\post\post-body.scss中添加如下内容
code, pre {
    font-size: 0.85rem;  // 这里可以设置代码部分的字体大小，单位可以根据需要调整
  }