Getting Started
Quick Start from Template
imfing/hextra-starter-template
You could quickly get started by using the above template repository.
We have provided a GitHub Actions workflow which can help automatically build and deploy your site to GitHub Pages, and host it for free. For more options, check out Deploy Site.
Start as New Project
There are two main ways to add the Hextra theme to your Hugo project:
Hugo Modules (Recommended): The simplest and recommended method. Hugo modules let you pull in the theme directly from its online source. Theme is downloaded automatically and managed by Hugo.
Git Submodule: Alternatively, add Hextra as a Git Submodule. The theme is downloaded by Git and stored in your project’s
themesfolder.
Setup Hextra as Hugo module
Prerequisites
Before starting, you need to have the following software installed:
Steps
Initialize a new Hugo site
hugo new site my-site --format=yamlConfigure Hextra theme via module
# initialize hugo module
cd my-site
hugo mod init github.com/username/my-site
# add Hextra theme
hugo mod get github.com/imfing/hextraConfigure hugo.yaml to use Hextra theme by adding the following:
module:
imports:
- path: github.com/imfing/hextraCreate your first content pages
Create new content page for the home page and the documentation page:
hugo new content/_index.md
hugo new content/docs/_index.mdPreview the site locally
hugo server --buildDrafts --disableFastRenderVoila, your new site preview is available at http://localhost:1313/.
How to update theme?
To update all Hugo modules in your project to their latest versions, run the following command:
hugo mod get -uTo update Hextra to the latest released version, run the following command:
hugo mod get -u github.com/imfing/hextraIf you want to try the most recent changes before the next release, update the module to the development branch directly (⚠️ may contain unstable/breaking changes):
hugo mod get -u github.com/imfing/hextra@mainSee Hugo Modules for more details.
Setup Hextra as Git submodule
Prerequisites
Before starting, you need to have the following software installed:
Steps
Initialize a new Hugo site
hugo new site my-site --format=yamlAdd Hextra theme as a Git submodule
Switch to the site directory and initialize a new Git repository:
cd my-site
git initThen, add Hextra theme as a Git submodule:
git submodule add https://github.com/imfing/hextra.git themes/hextraConfigure hugo.yaml to use Hextra theme by adding the following:
theme: hextraCreate your first content pages
Create new content page for the home page and the documentation page:
hugo new content/_index.md
hugo new content/docs/_index.mdPreview the site locally
hugo server --buildDrafts --disableFastRenderYour new site preview is available at http://localhost:1313/.
When using CI/CD for Hugo website deployment, it’s essential to ensure that the following command is executed before running the hugo command.
git submodule update --initFailure to run this command results in the theme folder not being populated with Hextra theme files, leading to a build failure.
How to update theme?
To update all submodules in your repository to their latest commits, run the following command:
git submodule update --remoteTo update Hextra to the latest commit, run the following command:
git submodule update --remote themes/hextraSee Git submodules for more details.
Next
Explore the following sections to start adding more contents: