Introduction

What is Hugo

Hugo is a framework to build static sites. With it you can generate production-ready sites from markdown files.

Why Hugo

Static sites generators have all the benefits from static sites (fast loading, easy search engine crawling), but they make creating new content very easy.

On top of that, Hugo has an amazing build speed compared to other generators, and has some key features that make it super powerfull!

Prerrequisites

This workshop asumes you some basic knowledge about:

HTML
Git (no shame on using a GUI instead of the console)
Command line
Programming concepts (loop, variable…)

Your computer also needs to have:

Git
Homebrew (just on Mac)

Set up

Create a new Hugo project and customize it with a public theme. Set the basic configuration needed and run your project locally.

Adding Content

Create new pages for your website, add images and learn how to separate them into sections. Customize the layout of any page.

Themes have different options to be configured, and getting to know the one that you are using leads to a better experience. This will allow you to customize the theme and manipulate the items shown in the different menus.

Shortcodes

Shortcodes add superpowers to markdown, allowing to insert dynamic HTML code. There are some already built-in, but we can easily create our own or copy the shortcodes shared by the community

Custom CSS

Different themes allow for different levels of personalization, but adding our personal touch is something that everybody wants. Don’t be shy and dig into your theme to customize it!

Organizing content: taxonomies

Tags are more common on blogs, to categorize the posts and allow the users to discover new content, but they can be also usefull for normal sites

Multilanguage

Having our content available on different languages is very important in a multinational world. With Hugo and the correct theme new languages can be configured in no time, and maintenance is almost none.

Deploy

After all this hard work, having your site online is the last step. There are multiple ways to do it, both free and paid. Lets check out a few of them!

Docs