drtranvanhan

Minimalist Hugo Template for Academic Websites

This repository contains a Hugo template to create a personal academic website. The template uses the PaperMod theme but modifies it in various ways to be more minimalist and better suited for academic websites. The website is hosted on GitHub Pages.

Documentation

The template is documented at https://pascalmichaillat.org/b/.

Illustration

The website produced by the template can be viewed at https://pascalmichaillat.org/hugo-website/.

Installation

On your local machine

• Install Hugo. On a Mac, this can be done with Homebrew: run brew install hugo in the terminal. If you already have Hugo but it is outdated, run brew upgrade hugo.
• Since the website is hosted on GitHub Pages, it is convenient to install GitHub Desktop. The website can be updated from your local machine via GitHub Desktop without going to GitHub.
• Clone the template repository to your local machine. This can be done in two steps:
  1. Click “Use this template” and then “Create a new repository” at the top of the repository.
  2. Once the new repository is created on your GitHub account, open GitHub Desktop and click “File” and then “Clone repository”. Find the newly created repository under the “GitHub.com” tab and clone it.
• Update the baseURL parameter in config.yml with the website URL that you plan to use. By default the URL is https://username.github.io.

On your GitHub account

• The first time that you push your repository to GitHub, you need to allow GitHub Actions and GitHub Pages so the website can be built and deployed to GitHub Pages.
• The first step is to ask GitHub to publish the website with a GitHub Action. GitHub offers a ready-made action to publish a Hugo website, called Deploy Hugo site to Pages. This action must be enabled in the Pages Settings of your GitHub repository. You can view the workflow triggered by the action in the .github/workflows/hugo.yml file.
• Once the GitHub Actions are enabled, GitHub will build and publish the website as soon as the repository is updated.
• If you would like to update the deployment action (for instance because it became outdated and fails to deploy the site), you can find the most recent action on GitHub. You can place this file directly in the .github/workflows folder to replace the old hugo.yml file—but make sure to set push: branches to ["main"].

Usage

Local development

Navigate to the website directory (cd) and run in the terminal:

hugo server

The command builds the website on your machine and makes it available at http://localhost:1313, rebuilding automatically as you edit. You can modify the content of the repository and develop your website entirely on your machine.

Online deployment

Once your website is ready to be made public, commit your content and template changes and push them to the website repository on GitHub. It is convenient to use GitHub Desktop for this Git operation.

On each push, the GitHub Actions workflow invokes Hugo to generate the website and deploys the output to GitHub Pages. During the workflow, Hugo processes your content, templates, and other project files and generates a static website.

Performance

The website performs well on mobile and desktop devices. Here is an overview of the mobile performance from PageSpeed Insights:

And here is an overview of the desktop performance:

Software

• The website is built with Hugo v0.147.2 via GitHub Actions.
• The website was developed locally with Hugo v0.147.2 on macOS Sequoia.
• The website was tested on the following browsers:
  • Safari 18.4 on macOS Sequoia
  • Mobile Safari on iOS 18
• Other Hugo versions, operating systems, and web browsers may require minor adjustments. Please report any issues to help improve compatibility.

License

This repository is licensed under the MIT License.

Real-world implementations

• Pascal Michaillat’s website (source code)
• Rosa van den Ende’s website (source code)
• Samia Kabir’s website (source code)
• Dylan Laplace Mermoud’s website (source code)
• Maarten Goos’s website (source code)
• Jun Wong’s website (source code)
• Erling Rennemo Jellum’s website (source code)
• Yangkeun Yun’s website (source code)
• Lucas Warwar’s website (source code)
• Franz Louis Cesista’s website (source code)
• Gabe Sekeres’s website (source code)
• Kevin Roice’s website (source code)
• Daniel Barbosa’s website (source code)
• Wei Zhang’s website (source code)
• Ben Hermann’s website (source code)
• Franco Corona’s website (source code)
• Tom George’s website (source code)
• Yucheng Zhou’s website (source code)
• Rui Sousa’s website (source code)
• Stefano Sangiovanni’s website (source code)
• Seth Watts’s website (source code)
• Louise Demoor’s website (source code)
• Giwon Bahg’s website (source code)
• Arthur Douillard’s website
• Benjamin Hattemer’s website
• Kostas Bimpikis’s website
• Qiwei He’s website
• Pierre Bardier’s website
• Marek Wiewiórka’s website
• Eran Shmuëli’s website
• Bo Wang’s website

Related resources

• latex-cv - This LaTeX template produces a minimalist academic CV, which you can post on your website. The CV should be named cv.pdf and placed in the static folder. It will be accessible from the homepage via a social icon.
• latex-paper - This LaTeX template produces a minimalist research paper, which you can post on your website. This is the template used to produce the mock papers on the illustrative website: here, here, and here.

This site is open source. Improve this page.