This article is about how to init a hugo site.
Hugo QuickStart
Init hugo site
Install Hugo
brew install hugo
hugo new site quickstart
cd quickstart
git init
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke themes/ananke
echo "theme = 'ananke'" >> config.toml
hugo server
hugo new posts/my-first-post.md
hugo server
Update config.toml
baseURL = 'http://example.org/'
languageCode = 'en-us'
title = 'My New Hugo Site'
theme = 'ananke'
GitHub Action
Create a file in .github/workflows/gh-pages.yml
name: github pages
on:
push:
branches:
- main # Set a branch that will trigger a deployment
pull_request:
jobs:
deploy:
runs-on: ubuntu-22.04
steps:
- uses: actions/checkout@v3
with:
submodules: true # Fetch Hugo themes (true OR recursive)
fetch-depth: 0 # Fetch all history for .GitInfo and .Lastmod
- name: Setup Hugo
uses: peaceiris/actions-hugo@v2
with:
hugo-version: 'latest'
# extended: true
- name: Build
run: hugo --minify
- name: Deploy
uses: peaceiris/actions-gh-pages@v3
if: github.ref == 'refs/heads/main'
with:
github_token: ${{ secrets.GITHUB_TOKEN }}
publish_dir: ./public
Remove Submodule
zh - Git Submodule
git rm --cached submodule_path # delete reference to submodule HEAD
git rm .gitmodules # delete .gitmodule file
rm -rf submodule_path/.git # delete submodule path .git file
Google Analytics
Setting Up Google Analytics on Hugo
Local Area Network Access Hugo
设置局域网内访问 hugo 本地服务 server
hugo server --bind="0.0.0.0"
# specific port
hugo server --bind="0.0.0.0" -p 1234
hugo server --baseURL=http://192.168.1.7 --bind=192.168.1.7
These are meta tags used for social media sharing, specifically for Facebook’s Open Graph Protocol.
<meta property="og:url" content="{{ .Permalink }}" />
sets the URL of the page being shared. .Permalink is a Hugo variable that holds the permanent link (URL) to the current page being rendered.
<meta property="og:site_name" content="{{ $.Site.Title }}" />
sets the name of the website or app that the content is being shared from. $.Site.Title is a Hugo variable that holds the title of the website or app.
The og: prefix stands for “Open Graph” and is a protocol developed by Facebook to standardize metadata for social media sharing. By including these meta tags in the <head>
section of your HTML, you are providing social media platforms with specific information about your website’s content, which can improve the appearance and accuracy of shared links.
open graph in iMessage
<meta property="og:title" content="iPhone" />
<meta property="og:image" content="https://example.com/image.png" />
Summary Card with Large Image
Twitter not displaying summary_large_image card correctly
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Germania: An Introduction">
<meta name="twitter:image" content="https://volkischexe.com/res/cards/germania-intro.png?605e46b26abc1">
Favicon
Page bundles
Put multi-content.md into one folder
Page Organization
disable list in _index.md
在Hugo中,要禁用一个_index.md文件中的列表页面,您可以通过在页面前置参数(front matter)中设置layout参数为"single"来实现。这将使Hugo使用单页布局模板渲染此页面,而不是默认的列表模板。
根据您使用的配置文件类型(TOML或YAML),以下是两个示例:
TOML格式的_index.md前置参数:
Copy code
+++
title = "Your Page Title"
date = 2023-04-23T00:00:00Z
layout = "single"
+++
YAML格式的_index.md前置参数:
---
title: "Your Page Title"
date: 2023-04-23T00:00:00Z
layout: "single"
---
这样,Hugo将使用"single"布局模板而不是列表模板渲染_index.md文件。请注意,如果您的主题没有提供名为"single"的布局模板,您可能需要自定义一个。在这种情况下,请查阅Hugo文档以了解如何创建自定义布局。