使用hugo+github搭建免费个人博客

使用hugo+github搭建免费个人博客

前提条件

  • win11电脑一台
  • 电脑安装了git
  • 电脑安装了hugo
  • github账号一个

个人博客本地搭建

初始化一个博客

打开cmd窗口,使用hugo新建一个博客工程

hugo new site blogtest

下载主题

主题官网:themes.gohugo.io

在上面找一个主题,我这里找名称为m10c 的主题:m10c | Hugo Themes (gohugo.io)

注意:不同主题的安装方式不同,以后再专门写一个文章介绍如何安装复杂主题。本文不使用git add submodule 或者git clone的方式下载主题,因为这个部署到github的时候会有问题,坑已踩过,请紧跟我走。

主题的网站是一个github仓库:vaga/hugo-theme-m10c: A minimalistic (m10c) blog theme for Hugo (github.com),我们需要把它的zip文件下载下来。

下载了zip文件之后,需要在hemes 目录新建一个m10c 的文件夹,然后把zip包里面的内容全部放到m10c 文件夹,放好之后的文件目录是这样的:

在这里插入图片描述

主题应用

在blogtest目录的cmd命令行,输入如下命令:

hugo server -t m10c

其中-t 是指定主题的意思。在浏览器中输入https://localhost:1313 就能访问

修改配置,将m10c 设置为默认主题:

参考E:\HugoProject\blogtest\themes\m10c\exampleSite\config.toml 的配置,修改E:\HugoProject\blogtest\hugo.toml 为如下

baseURL = 'https://lishuangquan1987.github.io/'
languageCode = 'en-us'
title = 'Tony Blog'
theme = 'm10c'
paginate = 8[menu][[menu.main]]identifier = "home"name = "Home"url = "/"weight = 1[[menu.main]]identifier = "tags"name = "Tags"url = "/tags/"weight = 2[[menu.main]]identifier = "about"name = "About"url = "/about/"weight = 3[params]author = "Tony"description = "familiar with c#,go,lua,vb6"menu_item_separator = "  ·  "[[params.social]]icon = "circle"name = "CSDN"url = "https://blog.csdn.net/lishuangquan1987"[[params.social]]icon = "github"name = "Github"url = "https://github.com/lishuangquan1987"# Default theme#[params.style]#  darkestColor = "#242930"#  darkColor = "#353b43"#  lightColor = "#afbac4"#  lightestColor = "#ffffff"#  primaryColor = "#57cc8a"# Green theme#[params.style]#  darkestColor = "#315659"#  darkColor = "#253031"#  lightColor = "#96a879"#  lightestColor = "#fff"#  primaryColor = "#dad865"# Red theme#[params.style]#  darkestColor = "#d35050"#  darkColor = "#212121"#  lightColor = "#d6d6d6"#  lightestColor = "#d3d3d3"#  primaryColor = "#ffffff"

其中几个比较重要的配置:

  • theme=m10c 指定默认主题
  • baseUrl=https://lishuangquan1987.github.io/ 这个后面将网站部署到github会用到

此时。我们再使用如下命令启动:

hugo server

在浏览器中发现能启动,且主题的文字发生变化。

新建一个文章

使用如下命令,可以新建一个文章:

hugo new post/k8s集群简单搭建.md

这时,我们直接运行hugo server 命令,发现不能看到文章,需要编辑k8s集群简单搭建.md:

+++
title = ‘K8s集群简单搭建’
date = 2023-10-05T12:32:30+08:00
draft = true
+++

其中有个draft=true 表示草稿的意思,将它去掉之后,就能看到文章了。往文章里面填写markdown 语法的内容即可

将博客部署到github

在github上新建仓库

在github上新建一个名称为 {用户名}.github.io的仓库。例如我的github用户名是lishuagnquan1987 ,那么我新建仓库名称为lishuagnquan1987.github.io

编译本地项目

E:\HugoProject\blogtest> 的命令行中输入如下命令:

hugo

即可编译项目,编译之后,发现生成了public文件夹

推送本地项目到github

E:\HugoProject\blogtest> 的命令行中输入如下命令:

  • 初始化git仓库

    git init
    
  • 添加远程仓库

    git remote add origin https://github.com/lishuangquan1987/lishuangquan1987.github.io.git
    
  • 暂存本地修改

    git add .
    
  • 提交本地修改

    git commit -m "first commit"
    
  • 提交本地修改到远程

    git push --set-upstream origin master
    

设置github仓库

在仓库主界面,点击Settintgs:

在这里插入图片描述

进入设置界面,点击左侧导航栏的Pages:

请添加图片描述

Build and deployment->Source中选择GitHub Actions:

在这里插入图片描述

点击browse all workflows:

在这里插入图片描述

然后搜索 hugo,找到hugo之后点击configure按钮:

在这里插入图片描述

它会自动在lishuagnquan1987.github.io/.github/workflows目录下新建一个hugo.yml文件

这时候,我们不需要修改任何东西,直接点击右侧的Commit changes 按钮提交修改即可:

在这里插入图片描述

此时,可以看到github正在构建你的项目:

在这里插入图片描述

等构建完毕之后,可以输入地址:http://lishuagnquan1987.github.io来访问你的博客啦:

在这里插入图片描述

注意:需要将新建的hugo.toml文件同步到本地,否则后续修改会造成冲突

git pull

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/150924.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【kubernetes的三种网络】

kubernetes的三种网络 一、三种网络service网络(service是虚拟IP地址)pod网络(pod的IP地址 docker容器的IP)节点网络(网络服务器上的物理网卡IP) 二、其他网络flannel一、vxlan(隧道方案)1.定义2.优势3.工作…

【Java每日一题】— —第二十四题:编程定义一个长方形类Rectangle(2023.10.08)

🕸️Hollow,各位小伙伴,今天我们要做的是第二十四题。 🎯问题: (1)定义成员变量:长(int height),宽(int width)&#xf…

uniapp uni.showToast 一闪而过的问题

问题:在页面跳转uni.navigateBack()等操作的前或后,执行uni.showToast,即使代码中设置2000ms的显示时间,也会一闪而过。 解决:用setTimeout延后navigateBack的执行。

论文笔记 A theory of learning from different domains

domain adaptation 领域理论方向的重要论文. 这篇笔记主要是推导文章中的定理, 还有分析定理的直观解释. 笔记中的章节号与论文中的保持一致. 1. Introduction domain adaptation 的设定介绍: 有两个域, source domain 与 target domain. source domain: 一组从 source dist.…

软件工程与计算总结(五)软件需求基础

本帖介绍软件需求涉及的诸多基本概念,通过对这些概念的阐述,剖析软件需求的来源、层次、类别、作用等重要知识~ 目录 ​编辑 一.引言 二.需求工程基础 1.简介 2.活动 3.需求获取 4.需求分析 5.需求规格说明 6.需求验证 7.需求管理 三.需求基…

JAVA在线电子病历编辑器源码 B/S架构

电子病历在线制作、管理和使用的一体化电子病历解决方案,通过一体化的设计,提供对住院病人的电子病历书写、保存、修改、打印等功能。电子病历系统将临床医护需要的诊疗资料以符合临床思维的方法展示。建立以病人为中心,以临床诊疗信息为主线…

FPGA project :HDMI

实验目标:驱动HdMI显示十色等宽彩条。 本实验的重点是: 1掌握TMDS通信协议。 2rgb565转rgb888。 3编写HDMI驱动程序。 4学会看流程图编写代码。 值得注意的事情 1注意数据与解析数据的信号(比如传入的数据中0或者1的个数)&…

OpenCV实现人脸检测(Haar特征)

学习目标 原理 实现 import cv2 as cv print(cv.__file__) 路径:E:\Anaconda3\envs\test_py3.6\Lib\site-packages\cv2\data 代码实现 import cv2 as cv import matplotlib.pyplot as plt from pylab import mplmpl.rcParams[font.sans-serif] [SimHei] #1&#x…

语义分割,实例分割,全景分割梳理

语义分割(semantic segmentation) 实例分割(instance segmentation) 全景分割(Panoptic Segmentation) 下面基于《Panoptic Segmentation 》这篇论文进行这几个概念的梳理 论文链接:https:/…

【算法刷题】【反转链表】给定一个单链表的头结点pHead(该头节点是有值的,比如在下图,它的val是1),长度为n,反转该链表后,返回新链表的表头。

题目 解决: import java.util.*;/** public class ListNode {* int val;* ListNode next null;* public ListNode(int val) {* this.val val;* }* }*/public class Solution {/*** 代码中的类名、方法名、参数名已经指定,请勿修改&#x…

gin路由相关方法

c.Request.URL.Path 拿到请求的路径 package mainimport ( "fmt" "github.com/gin-gonic/gin" "net/http")//路由重定向,请求转发,ANY ,NoRoute,路由组func main() { r : gin.Default() // -------…

DVWA-内容安全策略绕过

内容安全策略绕过 ​ 内容安全策略(Content Security Policy,简称CSP)是一种以可信白名单作机制,来限制网站是否可以包含某些来源内容,缓解广泛的内容注入漏洞,是一种用于增强网页的安全性的安全策略机制。…

React18学习

17、React_JSX的注意事项 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>JSX的注意</title><script src"./script/react.development.js"></script><script src"…

数据结构-优先级队列(堆)

文章目录 目录 文章目录 前言 一 . 堆 二 . 堆的创建(以大根堆为例) 堆的向下调整(重难点) 堆的创建 堆的删除 向上调整 堆的插入 三 . 优先级队列 总结 前言 大家好,今天给大家讲解一下堆这个数据结构和它的实现 - 优先级队列 一 . 堆 堆&#xff08;Heap&#xff0…

林沛满-Wireshark的提示

本文整理自&#xff1a;《Wireshark网络分析的艺术 第1版》 作者&#xff1a;林沛满 著 出版时间&#xff1a;2016-02 最近有不少同事开始学习 Wireshark&#xff0c;他们遇到的第一个困难就是理解不了主界面上的提示信息&#xff0c;于是跑来问我。问的人多了&#xff0c;我也…

VMProtect使用教程(VC++MFC中使用)

VMProtect使用教程(VCMFC中使用) VMProtect是一种商业级别的代码保护工具&#xff0c;可以用于保护VC MFC程序。以下是使用VMProtect保护VC MFC程序的步骤&#xff1a; 1. 下载并安装VMProtect,C包含库及目录。 2. 在VC MFC项目中添加VMProtectSDK.h头文件&#xff0c;并在需…

小谈设计模式(18)—适配器模式

小谈设计模式&#xff08;18&#xff09;—适配器模式 专栏介绍专栏地址专栏介绍 适配器模式角色分析目标接口&#xff08;Target&#xff09;源接口&#xff08;Adaptee&#xff09;适配器&#xff08;Adapter&#xff09; 核心思想应用场景Java程序实现输出结果程序分析123 优…

R语言通过接口获取网上数据平台的免费数据

大家好&#xff0c;我是带我去滑雪&#xff01; 作为一名统计学专业的学生&#xff0c;时常和数据打交道&#xff0c;我深知数据的重要性。数据是实证研究的重要基础&#xff0c;每当在完成一篇科研论文中的实证研究部分时&#xff0c;我都能深刻体会实证研究最复杂、最耗时的工…

零基础,想做一名网络安全工程师,我可以去哪里学,或者有什么建议?

这应该是全网最全的网络安全扫盲帖了&#xff01;发CSDN也有一段时间了&#xff0c;经常会有朋友在后台问我各种问题&#xff0c;比如“应该如何选方向”、“网络安全前景如何”、“怎么选适合的安全岗位”等等。于是今天借这个问题来给大家好好说说&#xff0c;如果你是零基础…

软件定制开发的细节|网站搭建|APP小程序定制

软件定制开发的细节|网站搭建|APP小程序定制 在定制开发的过程中&#xff0c;一些小的细节往往能够影响到最终的产品质量和用户体验。下面我将为大家介绍一些软件定制开发的细节。 第一&#xff0c;明确需求。在定制开发之前&#xff0c;我们需要明确客户的需求和目标。只有明确…