Using Hugo and possible errors
Installing Hugo is not a big deal. You just have to download the proper deb
file from their site. But using it, is another issue. The main problem that I faced was using the themes. Every theme has a toml
configuration file which is in charge of all the web elements (forgive me misusing the terms for I don’t web development too well). The problem is that theme makers use different toml
files; some are feature-rich and some are barren. Therefore, I had a hard time understanding them. But after spending a solid 3-4 hours, I got the hang of it.
In this blog, I shall talk about how to properly deploy your site to some hosting space using Hugo. Follow the steps mentioned below
Creating the site using Hugo
I shall not discuss this as this is very well discussed in their site.
Installing a theme
- Go to https://themes.gohugo.io
- Select any theme. Let’s assume you have selected the Hyde-Y theme
- Using
git
, clone the theme into thetheme
directory of your Hugo site directory - Copy the file
new_site/themes/hyde-y/theme.toml
tonew_site/config.toml
. Simply speaking, overwrite the file - Check using
hugo server
to see if the theme is working properly - It should be served at
127.0.0.1:1313
Note : You might want to use Incognito mode to check your site
Creating the posts
I shall also not discuss this as this is written in multiple tutorials before me. You must be wondering ‘Why the hell is this guy writing a tutorial then?’
That is because I can and I will!
Note : Seriously, just visit the site the original site and take a look at their quickstart guide; it will be enough
Creating an ‘About’ page
There is no magic regarding creating the About page. There is only hard work (I consider it to be hard work as I am not special)
However, the process of attaching the About page is a sort of hit-and-trial method. You should look into the toml
file to see how it should be attached. Read the theme documentation page for the best results.
Setting the correct baseurl
If you are not careful about this part, your deployed site will not have any styling. So be careful
- Let’s assume your are hosting your site at Github Pages and the URL is foobar.github.io
- Then, the
baseurl
should behttp://foobar.github.io/
. Make sure to give the forward slash at the end, otherwise you will have a non CSS website
Integration of Disqus
If you want Disqus support in your website, you have to first create a short URL for your website.
- Go to https://disqus.com/admin/create/
- Give a website name, say foobar
- Go to
https://foobar.disqus.com/admin/settings/general
- In website URL, put your website’s URL, that is `
https://foobar.github.io
Note : I spent 1 hour trying to connect Disqus to my website