Documentation
Getting Started

Getting Started

Quick Start from Template

 BlackTechX011/Blextra-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.

🌐 Demo ↗

Start as New Project

There are two main ways to add the Blextra theme to your Hugo project:

  1. 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.

  2. Git Submodule: Alternatively, add Blextra as a Git Submodule. The theme is downloaded by Git and stored in your project’s themes folder.

Setup Blextra 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=yaml

Configure Blextra theme via module 

# initialize hugo module
cd my-site
hugo mod init github.com/username/my-site

# add Blextra theme
hugo mod get github.com/BlackTechX011/Blextra

Configure hugo.yaml to use Blextra theme by adding the following:

module:
  imports:
    - path: github.com/BlackTechX011/Blextra

Create 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.md

Preview the site locally 

hugo server --buildDrafts --disableFastRender

Voila, 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 -u

To update Blextra to the latest released version, run the following command:

hugo mod get -u github.com/BlackTechX011/Blextra

See Hugo Modules for more details.

Setup Blextra 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=yaml

Add Blextra theme as a Git submodule 

git submodule add https://github.com/BlackTechX011/Blextra.git themes/Blextra

Configure hugo.yaml to use Blextra theme by adding the following:

theme: Blextra

Create 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.md

Preview the site locally 

hugo server --buildDrafts --disableFastRender

Your 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 --init

Failure to run this command results in the theme folder not being populated with Blextra 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 --remote

To update Blextra to the latest commit, run the following command:

git submodule update --remote themes/Blextra

See Git submodules for more details.

Next

Explore the following sections to start adding more contents:

Organize Files Configuration Markdown
Last updated on
DocumentationGuide