HUGO

  • News
  • Docs
  • Themes
  • Showcase
  • Community
  • GitHub
Star

What's on this Page

  • Prerequisites
  • Create a site
  • Add content
  • Configure the site
  • Publish the site
  • Ask for help
  • Other resources
GETTING STARTED

Quick Start

Learn to create a Hugo site in minutes.

In this tutorial you will:

  1. Create a site
  2. Add content
  3. Configure the site
  4. Publish the site

Prerequisites

Before you begin this tutorial you must:

  1. Install Hugo (the extended edition)
  2. Install Git

You must also be comfortable working from the command line.

Create a site

Commands

If you are a Windows user:

  • Do not use the Command Prompt
  • Do not use Windows PowerShell
  • Run these commands from PowerShell or a Linux terminal such as WSL or Git Bash

PowerShell and Windows PowerShell are different applications.

Run these commands to create a Hugo site with the Ananke theme. The next section provides an explanation of each command.

hugo new site quickstart
cd quickstart
git init
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke themes/ananke
echo "theme = 'ananke'" >> config.toml
hugo server

View your site at the URL displayed in your terminal. Press Ctrl + C to stop Hugo’s development server.

Explanation of commands

Create the directory structure for your project in the quickstart directory.

hugo new site quickstart

Change the current directory to the root of your project.

cd quickstart

Initialize an empty Git repository in the current directory.

git init

Clone the Ananke theme into the themes directory, adding it to your project as a Git submodule.

git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke themes/ananke

Append a line to the site configuration file, indicating the current theme.

echo "theme = 'ananke'" >> config.toml

Start Hugo’s development server to view the site.

hugo server

Press Ctrl + C to stop Hugo’s development server.

Add content

Add a new page to your site.

hugo new posts/my-first-post.md

Hugo created the file in the content/posts directory. Open the file with your editor.

---
title: "My First Post"
date: 2022-11-20T09:03:20-08:00
draft: true
---

Notice the draft value in the front matter is true. By default, Hugo does not publish draft content when you build the site. Learn more about draft, future, and expired content.

Add some markdown to the body of the post, but do not change the draft value.

---
title: "My First Post"
date: 2022-11-20T09:03:20-08:00
draft: true
---
## Introduction

This is **bold** text, and this is *emphasized* text.

Visit the [Hugo](https://gohugo.io) website!

Save the file, then start Hugo’s development server to view the site. You can run either of the following commands to include draft content.

hugo server --buildDrafts
hugo server -D

View your site at the URL displayed in your terminal. Keep the development server running as you continue to add and change content.

Hugo’s rendering engine conforms to the CommonMark specification for markdown. The CommonMark organization provides a useful live testing tool powered by the reference implementation.

Configure the site

With your editor, open the site configuration file (config.toml) in the root of your project.

baseURL = 'http://example.org/'
languageCode = 'en-us'
title = 'My New Hugo Site'
theme = 'ananke'

Make the following changes:

  1. Set the baseURL for your production site. This value must begin with the protocol and end with a slash, as shown above.

  2. Set the languageCode to your language and region.

  3. Set the title for your production site.

Start Hugo’s development server to see your changes, remembering to include draft content.

hugo server -D

Most theme authors provide configuration guidelines and options. Make sure to visit your theme’s repository or documentation site for details.

The New Dynamic, authors of the Ananke theme, provide documentation for configuration and usage. They also provide a demonstration site.

Publish the site

In this step you will publish your site, but you will not deploy it.

When you publish your site, Hugo creates the entire static site in the public directory in the root of your project. This includes the HTML files, and assets such as images, CSS files, and JavaScript files.

When you publish your site, you typically do not want to include draft, future, or expired content. The command is simple.

hugo

To learn how to deploy your site, see the hosting and deployment section.

Ask for help

Hugo’s forum is an active community of users and developers who answer questions, share knowledge, and provide examples. A quick search of over 20,000 topics will often answer your question. Please be sure to read about requesting help before asking your first question.

Other resources

For other resources to help you learn Hugo, including books and video tutorials, see the external learning resources page.

See Also

  • Host on 21YunBox
  • External Learning Resources
  • Use Hugo Modules
  • BSD
  • Basic usage
  • About Hugo
    • Overview
    • Hugo's Security Model
    • Hugo and GDPR
    • What is Hugo
    • Hugo Features
    • The Benefits of Static
    • License
  • Installation
    • Installation overview
    • macOS
    • Linux
    • Windows
    • BSD
  • Getting Started
    • Get Started Overview
    • Quick Start
    • Basic usage
    • Directory Structure
    • Configuration
    • External Learning Resources
  • Hugo Modules
    • Hugo Modules Overview
    • Configure Modules
    • Use Hugo Modules
    • Theme Components
  • Content Management
    • Content Management Overview
    • Organization
    • Page Bundles
    • Content Formats
    • Diagrams
    • Front Matter
    • Build Options
    • Page Resources
    • Image Processing
    • Shortcodes
    • Related Content
    • Sections
    • Content Types
    • Archetypes
    • Taxonomies
    • Summaries
    • Links and Cross References
    • URL Management
    • Menus
    • Static Files
    • Table of Contents
    • Comments
    • Multilingual
    • Syntax Highlighting
  • Templates
    • Templates Overview
    • Templating
    • Template Lookup Order
    • Custom Output Formats
    • Base Templates and Blocks
    • Render Hooks
    • List Templates
    • Homepage Template
    • Section Templates
    • Taxonomy Templates
    • Single Page Templates
    • Content View Templates
    • Data Templates
    • Partial Templates
    • Shortcode Templates
    • Local File Templates
    • 404 Page
    • Menu Templates
    • Pagination
    • RSS Templates
    • Sitemap Templates
    • Robots.txt
    • Internal Templates
    • Template Debugging
  • Functions
    • Functions Quick Reference
    • .AddDate
    • .Format
    • .Get
    • .GetPage
    • .HasMenuCurrent
    • .IsMenuCurrent
    • .Param
    • .Render
    • .RenderString
    • .Scratch
    • .Store
    • .Unix
    • absLangURL
    • absURL
    • after
    • anchorize
    • append
    • apply
    • base64
    • chomp
    • complement
    • cond
    • countrunes
    • countwords
    • crypto.FNV32a
    • default
    • delimit
    • dict
    • duration
    • echoParam
    • emojify
    • eq
    • errorf and warnf
    • fileExists
    • findRE
    • first
    • float
    • ge
    • getenv
    • group
    • gt
    • hasPrefix
    • highlight
    • hmac
    • htmlEscape
    • htmlUnescape
    • hugo
    • humanize
    • i18n
    • Image Filters
    • in
    • index
    • int
    • intersect
    • isset
    • jsonify
    • lang
    • lang.Merge
    • last
    • le
    • len
    • lower
    • lt
    • markdownify
    • Math
    • md5
    • merge
    • ne
    • now
    • os.Stat
    • partialCached
    • path.Base
    • path.BaseName
    • path.Clean
    • path.Dir
    • path.Ext
    • path.Join
    • path.Split
    • plainify
    • pluralize
    • print
    • printf
    • println
    • querify
    • range
    • readDir
    • readFile
    • ref
    • reflect.IsMap
    • reflect.IsSlice
    • relLangURL
    • relref
    • relURL
    • replace
    • replaceRE
    • safeCSS
    • safeHTML
    • safeHTMLAttr
    • safeJS
    • safeURL
    • seq
    • sha
    • shuffle
    • singularize
    • site
    • slice
    • slicestr
    • sort
    • split
    • string
    • strings.Contains
    • strings.ContainsAny
    • strings.Count
    • strings.FirstUpper
    • strings.HasSuffix
    • strings.Repeat
    • strings.RuneCount
    • strings.TrimLeft
    • strings.TrimPrefix
    • strings.TrimRight
    • strings.TrimSuffix
    • substr
    • symdiff
    • templates.Exists
    • time
    • time.Format
    • time.ParseDuration
    • title
    • transform.Unmarshal
    • trim
    • truncate
    • union
    • uniq
    • upper
    • urlize
    • urlquery
    • urls.Parse
    • where
    • with
  • Variables
    • Variables Overview
    • Site Variables
    • Page Variables
    • Shortcode Variables
    • Pages Methods
    • Taxonomy Variables
    • File Variables
    • Menu Variables
    • Git Variables
    • Sitemap Variables
  • Hugo Pipes
    • Hugo Pipes Overview
    • Hugo Pipes
    • Sass / SCSS
    • PostProcess
    • PostCSS
    • JavaScript Building
    • Babel
    • Asset minification
    • Asset bundling
    • Fingerprinting and SRI
    • Resource from Template
    • Resource from String
  • CLI
  • Troubleshooting
    • Troubleshoot
    • FAQ
    • Build Performance
  • Tools
    • Developer Tools Overview
    • Migrations
    • Starter Kits
    • Frontends
    • Editor Plug-ins
    • Search
    • Other Projects
  • Hosting & Deployment
    • Hosting & Deployment Overview
    • Hugo Deploy
    • Host on 21YunBox
    • Host on AWS Amplify
    • Host on Azure Static Web Apps
    • Host on Netlify
    • Host on Render
    • Host on Firebase
    • Host on GitHub
    • Host on GitLab
    • Host on KeyCDN
    • Host on Cloudflare Pages
    • Deployment with Rsync
    • Deployment with Rclone
    • Hosting on Azure Static Web Apps
  • Contribute
    • Contribute to Hugo
    • Development
    • Documentation
    • Themes
  • Maintenance
Last updated: February 27, 2023: Update quick-start.md (#1984) (6e32d059)
Improve this page
By the Hugo Authors
Hugo Logo
  • File an Issue
  • Get Help
  • Discuss Source Code
  • @GoHugoIO
  • @spf13
  • @bepsays

Netlify badge

 

Hugo Sponsors

 

The Hugo logos are copyright © Steve Francia 2013–2023.

The Hugo Gopher is based on an original work by Renée French.

  • News
  • Docs
  • Themes
  • Showcase
  • Community
  • GitHub
  • About Hugo
  • Installation
  • Getting Started
  • Hugo Modules
  • Content Management
  • Templates
  • Functions
  • Variables
  • Hugo Pipes
  • CLI
  • Troubleshooting
  • Tools
  • Hosting & Deployment
  • Contribute
  • Maintenance