Documentation and website setup.

Process

I was lured into using a static site generator instead of the usual HTML and CSS because it woulld require less coding.

We were given a choice between Hugo or Jekyll and Andrew and I chose the same theme in Hugo, Osprey Delight, to share the burden of learning to manipulate and Sean helped us set it up.

We didn’t read the READme and that’s where the problems started.

Problems that were resolved

Our first download and setup was long and tedious.

We had to set up Hugo and download Github desktop and other peripheral software to get everything working smoothly.

The website had various issues like the nav bar being stuck in the middle of the screen and the gallery being broken.

Piecemeal fixes were made, I edited the header bar code so that it’d stay at the top of the page and Sean also helped me create a static image directory so that was able to put images on my website because

In the end, we ended up overwriting the old site because it was easier to get it re-setup correctly than to fix the broken one.

Set up theme/website properly involved doing -rm copy commands, I don’t remember quite clearly right now.

Skills I’ive acquired

I know how to inspect elements on the website and how to find them in the code to modify them.

Gained Sublime knowledge and navigation skills.

Useful GitBash Commands

hugo server -D sh push.sh hugo new blog/week#.md hugo new gallery/item-name.md hugo new about.md

Things I’m still trying to figure how to do with Hugo

Images

-Resize images so they don’t take up the entire screen. -Maybe add a photo gallery

Formatting the text beyond default

• Make Code Block text smaller
• Being able to tab and center lines

Notes

I’m to inject custom hmtl or write Hugo shortcode by adding “markup.goldmark.renderer” to the config.toml

Resize image link

General Process

I went back and set up another website for the heck of it and it seems the general process is:

1. Install Hugo
2. Create new empty site using command “hugo new site quickstart”
3. Set up the theme with “git init” and “git submodule”
4. Link with Github and set up Github pages

It’s likely problems will be encountered but debugging and troubleshooting seems to be specific to each website. Best of luck.