Aoki Hiroki

AOKI HIROKI

console.log('πŸ™');

Get Started on Hugo

Learn how to get started on Hugo

aoki hiroki

2 minute read



Introduction

I made this site with Hugo. So I keep the record here for future reference.



Procedure

Create a Hugo site using the theme Hugo Future Imperfect Slim.



Install Hugo

$ brew install hugo



To verify your new install:

$ hugo version



Create a New Site

$ cd ~/hugo/ # this path is just my example
$ hugo new site your-site-name

πŸ’¬The above will create a new Hugo site in a folder named your-site-name.



Add a Theme

$ cd your-site-name/themes/
$ git clone https://github.com/pacollins/hugo-future-imperfect-slim.git

πŸ’¬ In this article, I use the theme Hugo Future Imperfect Slim. Note that the following setup steps are different for other themes. If you use other themes, follow the instruction of the theme you choose.



Copy the ExampleSite

Copy the contents of exampleSite to the root of your site directory: needless to say, not the root of the OS filesystem.

$ cp -ir ~/hugo/your-site-name/themes/hugo-future-imperfect-slim/exampleSite/* ~/hugo/your-site-name/ # copy while checking what is overwritten

overwrite ../config.toml? (y/n [n]) y # you'll see a prompt like this, then check and enter 'y'



Start the Hugo server

Start the Hugo server with drafts enabled.

$ cd ~/hugo/your-site-name/
$ hugo server -D # "-D" is an option to display contents marked as draft

                   | EN | FR | PL   # this theme can be configured for multiple languages
+------------------+----+----+----+
  Pages            | 26 | 23 | 23  
  Paginator pages  |  2 |  2 |  2  
  Non-page files   |  0 |  0 |  0  
  Static files     | 13 | 13 | 13  
  Processed images |  0 |  0 |  0  
  Aliases          |  7 |  5 |  5  
  Sitemaps         |  2 |  1 |  1  
  Cleaned          |  0 |  0 |  0  

Total in 202 ms
Watching for changes in /Users/user-name/hugo/your-site-name/{content,data,layouts,static,themes} # changes in these directories will be reflected immediately
Watching for config changes in /Users/user-name/hugo/your-site-name/config.toml # changes in this file will be reflected immediately
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop



Open exampleSite in browser

The exampleSite of the theme Hugo Future Imperfect Slim looks like this:

Recent posts

Categories

About

profile and works