Create Static Blog With Hugo and Github Pages in 5 Minutes

Create Static Blog With Hugo and Github Pages in 5 Minutes

Post Date : 2022-06-21T15:43:50+07:00

Modified Date : 2022-06-21T15:43:50+07:00

Category: cheatsheet

Tags: hugo

Todo

[x] Download hugo releases for windows 10

Eg: C:/softwares/hugo

image Open system environment variable image Add new hugo path image Add hugo path to path image Test

hugo --help

[x] Create new hugo site

hugo new site blog.jsguru.net --force

[x] Setup gh-pages for hugo

https://github.com/marketplace/actions/hugo-setup

.github\workflows\gh-pages.yml

name: GitHub Pages

on:
  push:
    branches:
      - main # Set a branch to deploy
  pull_request:

jobs:
  deploy:
    runs-on: ubuntu-20.04
    concurrency:
      group: ${{ github.workflow }}-${{ github.ref }}
    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: "0.91.2"
          # 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

[x] Add your github page

image

[x] Config DNS

image

[x] Add new post

hugo new [archtype]/[post-name].md "Post title"
# archtype === 'post'

hugo new post/hello.md "hello"