Building a Personal Website with Zola

2 min read

A comprehensive guide to creating a modern, fast personal website using the Zola static site generator.

Building a Personal Website with Zola

If you’re looking for a fast, reliable way to build a personal website or blog, Zola is an excellent choice. As a static site generator written in Rust, Zola combines simplicity with powerful features that make it perfect for developers who want full control over their site without the complexity of dynamic frameworks.

Why Choose Zola?

⚡ Blazing Fast Performance

Zola is built in Rust, which means it’s incredibly fast at building sites. Even large sites with hundreds of pages compile in seconds.

🎯 Simple Yet Powerful

  • No plugins needed - everything you need is built-in
  • Powerful templating system with Tera
  • Built-in Sass compilation
  • Syntax highlighting out of the box

📱 Modern Features

  • Responsive themes and layouts
  • SEO optimization tools
  • RSS feed generation
  • Search functionality

Getting Started

Installation

First, install Zola on your system:

# macOS
brew install zola

# Windows
winget install zola

# Linux
sudo snap install --edge zola

Creating Your Site

# Initialize a new Zola site
zola init my-website
cd my-website

# Start the development server
zola serve

Your site will be available at http://127.0.0.1:1111.

Project Structure

A typical Zola site has this structure:

my-website/
├── config.toml          # Site configuration
├── content/             # Markdown content
│   ├── _index.md       # Homepage content
│   └── blog/           # Blog posts
├── templates/          # HTML templates
├── static/            # Static assets
└── sass/              # Sass stylesheets

Creating Content

Blog Posts

Create blog posts in the content/blog/ directory:

+++
title = "My First Post"
date = 2024-01-20
description = "This is my first blog post!"
tags = ["first-post", "blogging"]
+++

# My First Post

Content goes here...

Pages

Create standalone pages in the content/ directory:

+++
title = "About Me"
+++

# About Me

Tell your story here...

Templating with Tera

Zola uses the Tera templating engine, which is similar to Jinja2:

<!-- base.html -->
<!DOCTYPE html>
<html>
<head>
    <title>{% block title %}{{ config.title }}{% endblock %}</title>
</head>
<body>
    {% block content %}{% endblock %}
</body>
</html>

Deployment

Zola makes deployment simple:

# Build the site
zola build

# The output is in the 'public/' directory
# Upload this to any static hosting service

Popular hosting options:

  • Netlify: Automatic builds from Git
  • Vercel: Fast global CDN
  • GitHub Pages: Free hosting for open source
  • Cloudflare Pages: Excellent performance

Pro Tips

1. Use Shortcodes

Create reusable components for your content by creating shortcodes in the templates/shortcodes/ directory.

2. Optimize Images

Add image processing to your templates:

{% set image = resize_image(path="image.jpg", width=800, height=600) %}
<img src="{{ image.url }}" alt="Description">

3. Use Taxonomies

Organize content with tags and categories:

# config.toml
[taxonomies]
tags = ["tags", "tag"]
categories = ["categories", "category"]

Conclusion

Zola strikes the perfect balance between simplicity and power. It’s fast, reliable, and gives you complete control over your site without overwhelming complexity. Whether you’re building a personal blog, portfolio, or documentation site, Zola is definitely worth considering.

Have you tried Zola for your projects? I’d love to hear about your experience in the comments or on social media!

Want to see the source code for this site? Check it out on GitHub!