首页 > 其他分享 >使用hugo生成静态个人博客,速度快,无需安装

使用hugo生成静态个人博客,速度快,无需安装

时间:2024-07-22 13:42:10浏览次数:10  
标签:avif git 静态 hugo 博客 https com ananke

1. 简介

hugo为使用go语言开发的博客生成程序,支持多种模板,主题,本地运行,将markdown转换为一个网站,适合做文档网站,博客等。

hugo在github上有超过70W星。

2. 下载

https://gohugo.io/

3. 安装运行

解压后,仅有一个20M左右的exe文件,在Powershell中执行即可。

./hugo.exe new site quickstart   #quickstart为你的站点名
cd quickstart
git init
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke  #你可能需要配置git代理,请参考https://www.cnblogs.com/jopny/p/18298798/Git-Set-Proxy-Server
echo "theme = 'ananke'" >> hugo.toml # 指定当前Theme
hugo server #生成,并开启一个Web服务,默认Url:http://localhost:1313/

增加Theme ananke

git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke

增加Theme ananke

git submodule add https://github.com/FarseaSH/hugo-theme-moments.git themes/moments

4.  页面配置

4.1 content文件下为带生成的markdown内容。

以下是一个.md文件的头

--- # 前面不要有空行,否则不能高亮显示。这里不要使用+++,否则预览时会front matter不会被隐藏,亦不会高亮显示front matter内容
title: 'Git代理设置'
description:  '1.设置临时代理,取消临时代理。2. 设置永久代理。3. SSL设置'
categories: ['Development', 'Tools']
slug: 'git-proxy-config-ssh'
tags: ['git', 'ssh', 'proxy', 'setting']
date: 2024-07-12T23:02:44+08:00 # 未来日期不会被生成
draft: false
isCJKLanguage: true  #有此项设置的SummaryLength才有用
summary: '1.设置临时代理,取消临时代理。2. 设置永久代理。3. SSL设置'  # 这里是自定义的文章列表中显示的摘要
featured_image: 'Pickup-roller.png'  # 不要加./这种相对路径,否则生成路径在首页和详情页不同,导致无法显示。
---

4.2  首页显示的列表,默认是最新的三个,包括content文件下的所有内容

4.3  路径处理

例如:
content/
└── posts/
    └── avif-maker/           <-- 页面束
        ├── post-x.md         <-- 改为index.md
        └── avif-maker.jpg    <-- 页面资源

生成后的Url: https://xx.com/posts/avif-maker/psot-x/ 页面中插入图片:  
![制作avif动画/动图](avif-maker.webp "制作avif动画/动图")  # 这里尽量不要使用./这种相对路径,如果使用,显示没有问题,就是其路径是完整的加了http://example.com:1313/这种完整路径。
此时的图片链接错误,不能显示出来。如果路径改成../avif-maker.webp,最然生成页面能显示出来了,但markdown编写时的预览页面显示不出来。 如果将post-x.md改为index.md,
content/
└── posts/
    └── avif-maker/           <-- 页面束
        ├── index.md         <-- 改为index.md
        └── avif-maker.jpg    <-- 页面资源
则生成的Url为:
https://xx.com/posts/avif-maker/
此时使用图片路径./avif-maker,则预览和生成结果均能正常显示。

5. hugo.toml配置例子

baseURL = 'https://www.yourdomain.xyz/'
languageCode = 'zh-cn'
title = 'XXXX小站'
theme = 'ananke'
[params]
  subtitle = 'The Best Widgets on Earth'
  [params.contact]
    email = '[email protected]'
    phone = '+1 202-555-1212'
	
[menus]
  [[menus.main]]
    name = '博客'
    pageRef = '/posts'
    weight = 9
  [[menus.main]]
    name = '科技'
    pageRef = '/tech'
    weight = 10
  [[menus.main]]
    name = 'About'
    pageRef = '/about'
    weight = 20
  [[menus.main]]
    name = 'Contact'
    pageRef = '/contact'
    weight = 30


[mediaTypes]
  [mediaTypes.'image/avif']
    suffixes = ['avif']
	
summaryLength = 20
hasCJKLanguage = true

 

标签:avif,git,静态,hugo,博客,https,com,ananke
From: https://www.cnblogs.com/jopny/p/18299203/Hugo-static-website-generator

相关文章

  • 20240721-宝塔面板配置及博客网站搭建
    首先部署宝塔面板,并登录登录前先进行面板的配置:登录之后安装软件和环境(mysql,php,ftp,nginx等)添加一个网站,根据需求填选项网站创建完成!现在去WordPress下载源码:下载完成是个压缩包,解压:计划通过FTP服务将源码上传至服务器网站根目录但FTP连接时出现问题:经调查发现FTP服务器被动模式使......
  • 【Linux】基础I/O——动静态库的制作
    我想把我写的头文件和源文件给别人用1.把源代码直接给他2.把我们的源代码想办法打包为库1.制作静态库1.1.制作静态库的过程我们先看看怎么制作静态库的! makefile所谓制作静态库需要将所有的.c源文件都编译为(.o)目标文件。使用ar指令将所有目标文件打包为静态库。......
  • Linux下C++静态链接库的生成以及使用
    目录一.前言二.生成静态链接库三.使用静态链接库一.前言这篇文章简单讨论一下Linux下如何使用gcc/g++生成和使用C++静态链接库(.a文件)。二.生成静态链接库先看下目录结构然后看下代码//demo.h#ifndefDEMO_H#defineDEMO_H#include<string>classDemo{p......
  • 主题皮肤收费是否能成为博客园的第一步改变?
    在去年10月刷b站时看见某Up主发布的博客园求救信,那时候真令我感到不可思议。在我看来博客园不说与BSDN经济对标,有一半以上实力还是没问题的。这样一个大站居然需要发文靠会员捐助来渡过难关,实在让我小小地震惊了一把。直到今天,看到 给博客园的寄语-☆№忧忧★♂-博......
  • 课程设计-基于Springboot+Vue的校园博客系统的设计与实现(源码+LW+包运行)
    源码获取:https://download.csdn.net/download/u011832806/89433158基于SpringBoot+Vue的校园博客系统开发语言:Java数据库:MySQL技术:SpringBoot+MyBatis+Vue.js工具:IDEA/Ecilpse、Navicat、Maven系统演示视频:链接:https://pan.baidu.com/s/1yZVhNtOiNRUXoi3rJkzcHA?pwd=cn......
  • 从零开始:如何使用GitHub与Hexo搭建个人博客
    搭建效果:[Dangrow的技术博客]https://tangwanying.xyz一、首先创建一个GitHub仓库如图,资源的名称可以是你的用户名+github+io(ps:因为我已经搭建过了,所以下图会出现仓库已存在的警告)二、本地安装git这里建议本地与GitHub采用SSH连接,防止经常连接不到的错误git官网连接三、......
  • 小学期第三次博客--实现代码如下
    packagecom.example.hadoop;importjava.sql.Connection;importjava.sql.DriverManager;importjava.sql.SQLException;publicclassHiveJdbcUtils{privatestaticfinalStringURL="jdbc:hive2://192.168.26.2:10000/testforhadoop";privat......
  • 关于service层自动生成mapper接口时为静态方法的解决办法
    在Service层自动生成Mapper方法的时候出现带方法体的静态方法而不是抽象方法,例如mapper中生成这样的方法:staticIntegerordersStatistics(Mapmaps){  }原因可能有两种1、mapper层未加mapper注解2、Service层调用的是Mapper类而不是使用Mapper生成的mapper对象错......
  • 给你的博客加上彩蛋~
    给打开控制台的人一个惊喜~~......
  • java项目(knife4j使用,静态资源未放在static资源包下,公共字段自动填充,Spring Cache与Spr
    Knife4j(生成接口文档)使用swagger你只需要按照它的规范去定义接口及接口相关的信息,就可以做到生成接口文档,以及在线接口调试页面。官网:https://swagger.io/Knife4j是为JavaMVC框架集成Swagger生成Api文档的增强解决方案。使用方式1、导入knife4j的maven坐标<dependency>......