Publish hugo websit on github

Hugo is a static web develop tool. This website is just use hugo to develop, here is the method how to publish it in github.

Publish static web

For static website, we can just use Git to publish it. Go to Setting -> Page and then set the page you want to publish, and then save it.

Publish Static Website

Publish hugo

Create two repos, one is Source repo and one is Page repo
For Source repo, we set it as public, Page as private
In the github account for Page, create a deploy key or personal key
In the Source repo create a workflow and set the sceret with the personal token.

Here is the workflow for Source:

name: GitHub Pages

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

jobs:
  deploy:
    runs-on: ubuntu-22.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.107.0'
          extended: true

      - name: Build
        run: hugo 

      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3
        if: ${{ github.ref == 'refs/heads/main' }}
        with:
          personal_token: ${{ secrets.ACCESS_TOKEN }}
          publish_dir: ./docs
          publish_branch: main
          external_repository: wguansky/blog

Then the code will be build in Source workflow and then push to Page, after it finished, Page’s workflow will build and deploy the page, then you can visit the hugo website.