From the Readme

It is fitting that the first post in this blog is a from the file that was created from the research of getting this blog up and running on GitHub Pages.

git submodule add themes/hugo-theme-codex
git submodule init
git submodule update
  • To get started, copy the config.toml file inside exampleSite to the root of your Hugo site:
cp themes/hugo-theme-codex/exampleSite/config.toml .
  • Note that if you are cloning this repo, then you only do the following from the CLI:
git submodule init
git submodule update
  • Next, make updates to the config.toml file in the root of your Hugo site using the theme’s exampleSite/config.toml file:
theme = "hugo-theme-codex"

# Override these settings with your own
title = "BIS 402"
languageCode = "en-us"
baseURL = ""
copyright = "© {year}"

# Optional params
  # Follow the Hugo date/time format reference here: 
  dateFormat = "Jan 2 2006"

  # Links to your social accounts, comment/uncomment as needed. Icons will be displayed for those specified.
  twitter = ""
  github = ""
  email = ""
  # Titles for your icons (shown as tooltips), and also their display order.
  # Currently, these icons are supported: 
  #   "Twitter", "GitHub", "Email", "Mastodon", "Facebook", "GitLab", "Instagram", "LinkedIn", "YouTube"
  iconOrder = ["Twitter", "GitHub"]

  # Metadata for Twitter cards, defaults to params.twitter
  twitterSite = "@m2web"
  twitterAuthor = "@m2web"

  # Set to true to display page title in table of contents in blog posts.
  showPageTitleInTOC = false

# This disables Hugo's default syntax highlighting in favor
# of prismjs. If you wish to use Hugo's default syntax highlighting
# over prismjs, remove this. You will also need to remove the prismjs
# vendor script in layouts/blog/single.html.
    codeFences = false
  # Set to false to disallow raw HTML in markdown files
      unsafe = true

# Controls the navigation
  identifier = "about"
  name = "about"
  title = "About"
  url = "/"

  identifier = "blog"
  name = "blog"
  title = "Blog"
  url = "/blog"

    fancy = "#FFD700"
  • After this, I added a favicon.ico file to the static/images directory. To display the favicon in the web browser tab I added a layouts/partials/header.html file by copying the the themes/layouts/partials/header.html file to the root of my Hugo site. I did this to override the default header. Within the layouts/partials/favicon.html file I added the following:
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">
  • I then added a meta name keyword tag (words relevant to the page’s content separated by commas) to the layouts/partials/favicon.html file. I did this by adding the following:
<meta name="keywords" content="NKU, Northern Kentucky University, BIS 402, Programming for E-Business"/>
  • Next, I added a .github/workflows folder to the root of my Hugo site and then a gh-pages.yml file to the workflows folder. Following the example gh-pages.yml in I updated the gh-pages.yml file to the following:
name: GitHub Pages
      - main  # Set a branch name to trigger deployment
    runs-on: ubuntu-20.04
      group: ${{ github.workflow }}-${{ github.ref }}
      - uses: actions/checkout@v2
          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
          hugo-version: 'latest'
          extended: true
      - name: Build
        run: hugo --minify
      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3
        if: ${{ github.ref == 'refs/heads/main' }}
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./public

  • Then, after several trial and errors with getting the settings correct, I pushed the final gh-pages.yml changes to GitHub. I did this by typing the following:
git add .
git commit -m "Update gh-pages.yml with extended hugo version using Hugo site recommended settings"
git push
  • After this, I noted that the GitHub Pages site was only displaying a site link and the file content. Again, after many trials and tribulations I then updated the GitHub Pages settings Source branch to gh-pages and pointing to the root folder:

GitHub Pages settings Source branch

  • Finally, the site displayed correctly!