Hugo is free, static, fast and minimal website creator. In this blog we are going to setup this current Hugo site (without modification) and deploy to Github Pages for free. I am also going to setup so new posts can be added and published on your website everytime.
-
Login Github
-
Install Hugo On System
-
Create Two Repos on Github
a. blog Houses our hugo code b. username.github.io For website generated pages
-
Get Theme for Hugo (ZZO)
-
Clone ‘blog ’ Repo in Desktop (notesite)
git clone https://github.com/*/blog.git
-
Inside blog repo run Hugo
- /blog/
hugo new site notes
- /blog/notes/
git submodule add https://github.com/zzossig/hugo-theme-zzo.git themes/zzo
- /notes/
sudo nano config.toml
- to use toml or change it to yaml. NOTE - add
theme: zzo
and change baseUrl value
- /blog/
Use any converter from Google and save it as config.yaml and delete toml file.
- Test Site in local server with /notes/
hugo server
- add a demo post with /notes/
hugo new posts/firstPost.md
- Edit
Title
, removedraft
add contents below horizontal line.
Submodule
- Go back to /notesite/
cd ../
- /notesite/
git clone https://github.com/username/username.github.io
- /notesite/
cd username.github.io
- create and switch to main branch /username.github.io/
git checkout -b main
- have atleast one commit as readme /username.github.io/
touch readme.md
- /username.github.io/
git add .
- commit to main /username.github.io/
git commit -m "Adding Readme"
- push to main branch /username.github.io/
git push origin main
Add Git Submodule
References to the repository.
- /username.github.io/
cd ../
- /notesite/
cd blog
- /blog/
cd notes
- Add static genereated files to /public/ folder:
/notes/
git submodule add -b main https://github.com/username/username.github.io public
- Build site using /notes/
hugo -t PaperMod
- All static sites are generated in public Folder
Upload to username.github.io
- Inside /public/ folder
/public/
git add .
/public/git commit -m "First static upload"
/public/git push origin main
- DEPLOYED
NOTE: Folder Structure /notesite/blog/notes/public /notesite/username.github.io/
ADDING NEW POST AND PUBLISHING
Generate Note
/notes/ hugo new posts/post.md
/notes/ hugo -t PaperMod
Push to Blog Repo
- /notes/
git add .
- /notes/
git commit -m "somemsg"
- /notes/
git push origin main
Push to Github pages and Publish on Website
- /notes/
cd public
- /notes/public/
git add .
- /notes/public/
git commit -m "somemsg"
- /notes/public/
git push origin main
NOTE: Folder Structure
/notesite/blog/notes/public/
/notesite/username.github.io/