Step by step guide to host your first gohugo static website on netlify

There are hundreds of guide available online to host your gohugo site, but none of them are a complete one. Basically those are not targeted to newbies & beginners.

So in this article we will learn how to generate our first static site with gohugo & later we will host it on Netlify.

Only basic linux knowledge is required.

So lets get started:

System requirement: Ubuntu or Debian.

I am using debian jessie .

Check if go is installed?

$go version
go version go1.7.4 linux/amd64

Now get gohugo from github

go get -u -v github.com/spf13/hugo

After installing gohugo you have to add it to system path.

$ sudo vim /etc/profile

Add these lines to end of the file

export PATH=$PATH:$GOPATH/bin

Now check hugo version

asitm9@hex:~$ hugo version
Hugo Static Site Generator v0.19-DEV linux/amd64 BuildDate: 2017-02-25T13:19:16+05:30

Create your very first hugo site & serve it

asitm9@hex:~$ hugo new site blog
asitm9@hex:~$ cd blog
asitm9@hex:~$ hugo server

Now install a theme

asitm9@hex:~$ cd themes
asitm9@hex:~$git clone https://github.com/sethmacleod/prologue.git

Copy the config.toml from the exampleSite folder into your Hugo site’s root folder. Now rerun the hugo server command, theme is ready for you. As simple as that.

Now we will serve this content using netlify.com.

For this task we will use victor-hugo tool from netlify.

Install node js & npm .

$ git clone https://github.com/netlify/victor-hugo.git
$ npm install
$ npm start

Now copy all the content form the blog directory (previously created ) to the sitedirectory inside victor-hugo .

Next copy /blog/themes/prologe/static/css to victor-hugo/src/css

copy /blog/themes/prologe/layouts to victor-hugo/site/layouts

Now make sure that victor-hugo/site/content directory isn’t empty.

Thats it. Login to netlify & import it. Voila.