Create Content

HugoBlox supports various content types to structure your website effectively, from blog posts to event pages.

Accelerate your content delivery and forget about distractions. HugoBlox empowers you to visually manage everything from publications to blog posts directly in VS Code, so you can focus purely on your research.

🚀 Quick Start

Choose your preferred way to create content:

The HugoBlox Studio extension for VS Code provides a visual interface for managing content.

Open the HugoBlox sidebar in VS Code.
Click the + (Create) button next to a content collection (e.g. Posts).
Enter a title and press Enter.

Use the Hugo CLI to generate files with the correct frontmatter automatically.

Create a Post

hugo new content/post/my-new-post.md

Create a Publication

hugo new content/publication/my-paper/index.md

Create files and folders manually in your file explorer.

Navigate to the content/ folder.
Open the folder for your content type (e.g. post/).
Create a new file ending in .md (e.g. hello.md).
Copy one of the Frontmatter Templates below to the top of your file.

📦 What can I create?

Page

Standard pages like “About” or “Contact”. Located in content/.

Post

Blog articles, news, or updates. Located in content/post/.

Publication

Academic papers, journals, or conference proceedings. Located in content/publication/.

Event

Talks, conferences, or workshops. Located in content/event/.

Slides

Reveal.js presentations created with Markdown. Located in content/slides/.

Project

Showcase your work or case studies. Located in content/project/.

📂 File Structure

Organizing your files correctly ensures they appear in the right section of your site.

Directorycontent/
- _index.md # Homepage (Landing Page)
- about.md # Standard Page
- Directorypost/
  - my-first-post.md
- Directoryslides/
  - Directorymy-talk/
    index.md # Presentation slides
- Directorypublication/
  - Directoryjournal-article/
    index.md # Page Bundle (Folder + Assets)
    cite.bib # Citation file
    featured.jpg # Featured image
- Directoryevent/
  - conference.md

Frontmatter Templates

Copy these YAML blocks to the top of your Markdown files to configure them.

Page

Use for standard pages like “About” or “Privacy Policy”.

---
title: About Me
date: 2023-01-01
type: page
---

Landing Page

The homepage is usually defined in content/_index.md.

---
title: Home
type: landing
sections:
  - block: hero
    content: ...
---

Publication

Best created as a Page Bundle (folder with index.md) so you can include a PDF and citation.

---
title: "My Research Paper"
date: 2023-09-01
publication_types: ["article-journal"]
publication: "*Journal of Science*"
abstract: "This is the abstract..."
featured: true
links:
  - name: PDF
    url: paper.pdf
---

Project

Showcase your work.

---
title: "My App"
type: project
summary: "Short teaser for the project card."
featured: true
repo: "https://github.com/..."
links:
  - name: Demo
    url: "https://..."
---

Event

For conferences, talks, or webinars.

---
title: "Conference Talk"
type: event
event: "AI Research Conference"
event_url: "https://example.com"
location: Online & In-Person

# Talk start and end times.
date: '2030-06-01T13:00:00Z'
date_end: '2030-06-01T15:00:00Z'

# Link to content/slides/my-presentation/
slides: "my-presentation"

abstract: "Join us to explore HugoBlox..."
---

Slides

Create a folder in content/slides/ with an index.md.

---
title: "My Presentation"
date: 2024-06-15
type: slides

slides:
  theme: black
  diagram: true
---

# My Presentation

---

## Slide 2