Moving to Hugo

This blog entry provide information about the setup of a Hugo blog using orgmode. Hugo has been established in the field of static websites and blogs. It is based on Go programming language. The user is writing her posts in Markdown which makes it easy to use. I decided to quit Jekyll (and particular org2jekyll) and to begin a new blog using Hugo & orgmode. Hugo has a large collection of templates, and the present template is called hugo-dusk.

Start a Hugo blog using orgmode

The first step is to make the home folder of your blog, let's say this is called blogging. In your blog home directory (BLOGHOMEDIR) you have to make a directory called themes, and to clone the template of your choice.


$ mkdir ~/blogging
$ BLOGHOMEDIR=~/blogging
$ cd $BLOGHOMEDIR
$ mkdir themes
$ cd themes
$ git clone https://github.com/gyorb/hugo-dusk

Basic structure of Hugo

    In your BLOGHOMEDIR you need the followings:
  1. config.toml
  2. $BLOGHOMEDIR/content/post folders to write your blog posts
  3. $BLOGHOMEDIR/themes/<template> folder

In principle, you should copy the contents of the $BLOGHOMEDIR/themes/<template>/exampleSite in your BLOGHOMEDIR. Hugo gives precedence to any files that are placed in your BLOGHOMEDIR, given that the basis is the $BLOGHOMEDIR/themes/<template>. So, if you would like to use the builtin functionality of the template you need to do only the 3 steps as described above. The directory structure of Hugo is explained here.

My directory structure looks as below:


cd $BLOGHOMEDIR && tree -L 3


.
├── archetypes
├── config.toml
├── content
│   ├── about.org
│   └── post
│       └── moving-to-hugo.org
├── data
├── layouts
├── static
└── themes
    └── hugo-dusk
        ├── LICENSE.md
        ├── README.md
        ├── archetypes
        ├── exampleSite
        ├── images
        ├── layouts
        ├── static
        └── theme.toml

13 directories, 6 files

Browse your blog


$ cd $BLOGHOMEDIR && hugo server -D

Open your browser and go to this address http://localhost:55400/~gediapou/hugo/. Hugo by default open the port 1313, but in my case this is in use.


ERROR 2017/10/12 16:52:08 port 1313 already in use, attempting to use an available port
Started building sites ...

Built site for language en:
0 draft content
0 future content
0 expired content
2 regular pages created
12 other pages created
0 non-page files copied
1 paginator pages created
0 categories created
2 tags created
total in 37 ms
Watching for changes in /Users/opiskelija/hugo/blogging/{data,content,layouts,static,themes}
Serving pages from memory
Web Server is available at http://localhost:55400/~gediapou/hugo/ (bind address 127.0.0.1)
Press Ctrl+C to stop

My config.toml


baseURL = "http://users.jyu.fi/~gediapou/hugo/"
title = "Georgios Diapoulis blog"
copyright = "Copyright (c) 2017, all rights reserved."
canonifyurls = true
languageCode = "en-US"
paginate = 3
theme = "hugo-dusk"

googleAnalytics = ""
disqusShortname = ""

[author]
  name = "Georgios Diapoulis"

SectionPagesMenu = "main"

[permalinks]
post = "/:year/:month/:day/:title/"

[[menu.main]]
  name = "Posts"
  weight = -120
  identifier = "post"
  url = "/post/"

[[menu.main]]
  name = "Tags"
  weight = -110
  identifier = "tag"
  url = "/tags/"

[params.meta]
  keywords = "blog, tech"
  description = "Personal blog."

[params]
  github = "gewhere"
  twitter = "aucotsi"
  email = "myemail"

How this org file looks like


#+TITLE: Moving to Hugo
#+DATE: 2017-10-12
#+TAGS: hugo orgmode



This blog entry provide information about the setup of a [[https://gohugo.io/][Hugo]] blog using [[http://orgmode.org/][orgmode]].  Hugo has been established in the field of static websites and blogs.  It is based on [[http://golang.org/][Go programming language]].  The user is writing her posts in [[https://daringfireball.net/projects/markdown/][Markdown]] which makes it easy to use.  I decided to quit [[https://jekyllrb.com/][Jekyll]] (and particular [[https://github.com/ardumont/org2jekyll][org2jekyll]]) and to begin a new blog using Hugo & orgmode.  Hugo has a large [[https://github.com/gohugoio/hugoThemes][collection of templates]], and the present template is called [[https://themes.gohugo.io/hugo-dusk/][hugo-dusk]].


* Start a Hugo blog using orgmode
The first step is to make the home folder of your blog, let's say this is called /blogging/.  In your blog home directory (=BLOGHOMEDIR=) you have to make a directory called =themes=, and to clone the template of your choice.

Deploy your website to the server

Hugo creates static websites. All you have to do is to execute hugo and copy the content of $BLOGHOMEDIR/public/ directory to the server.

  • Render your static website: $ cd $BLOGHOMEDIR && hugo
  • Upload to server: $ rsync -avz $BLOGHOMEDIR/public/* username@servername.address:/path/to/folder/