Hugo Static Site Blog Management

This skill helps you develop and manage a Hugo static site blog with the minimalist Risotto theme. The site focuses on offensive security and malware development topics with a terminal-inspired aesthetic.

Site Architecture Overview

This is a Hugo static site for Jeff Barron's security blog:

Development Workflow

1. Local Development Server

Start the development server to preview changes in real-time:

```bash

Start with drafts visible

hugo server -D

Start with published content only

hugo server

```

Access the site at `http://localhost:1313/` (default port).

2. Content Creation

Create new blog posts or pages:

```bash

Create a new blog post

hugo new posts/my-new-post.md

Create a new page

hugo new about/index.md

```

All new content will include proper frontmatter template:

```yaml

---

title: "Post Title"

date: 2024-01-01

draft: false

tags: ["tag1", "tag2"]

categories: ["category"]

---

```

3. Content Structure

Understand the site's content organization:

Navigation menu includes: Home, Posts, About, Projects.

4. Content Focus Areas

When creating content, focus on:

5. File Organization Best Practices

6. Site Management Commands

```bash

View all content structure

hugo list all

Check for issues with verbose output

hugo --verbose

Check Hugo version

hugo version

Clean public directory before fresh build

rm -rf public/

```

7. Build for Production

Generate static files for deployment:

```bash

Build site (outputs to public/ directory)

hugo

```

The `public/` directory contains all built site files ready for deployment.

8. Deployment to GitHub Pages

Deployment process:

1. Run `hugo` to generate static files in `public/`

2. Commit and push changes to the repository

3. GitHub Pages automatically deploys from the repository

The site is configured for deployment at `jeffaf.github.io`.

Configuration Details

Key Settings (`hugo.toml`)

Social Links

Theme Customization

The Risotto theme supports extensive customization:

**Color Palettes**: Switch via `params.theme.palette` in `hugo.toml`

Available palettes: `apprentice`, `base16-dark`, `base16-light`, `dracula`, `gruvbox-dark`, `gruvbox-light`, `material`, `papercolor-dark`, `papercolor-light`, `solarized-dark`, `solarized-light`, `tender`, `tokyo-night-dark`, `tokyo-night-light`, `windows-95`, `windows-95-light`

**Custom CSS**: Add files to `static/css/` directory

**Favicon**: Place favicon files directly in `static/` directory

Technical Features

Workflow Example

1. Create a new post: `hugo new posts/malware-analysis-techniques.md`

2. Edit the markdown file in `content/posts/`

3. Start dev server: `hugo server -D`

4. Preview at `http://localhost:1313/`

5. When ready, set `draft: false` in frontmatter

6. Build site: `hugo`

7. Commit and push to deploy

Important Notes