SkillAgentSearch skills...

Santamonica

Simple Zola-based podcast website, designed for fans of self-hosted-ness.

Install / Use

/learn @sirodoht/Santamonica
About this skill

Quality Score

0/100

Category

Design

Supported Platforms

Universal

README

santamonica

Simple Zola-based podcast website, designed for fans of self-hosted-ness.

Features

  • Statically generated
  • RSS support
  • Support for static pages (eg. About page)
  • Content in markdown files
  • "Read more" feature
  • Native HTML <audio> player
  • Simple, responsive CSS based only on normalize.css
  • Easily customisable
  • No JS
  • Zola is the only third-party dependency used

How to use

Clone, edit config.toml with your podcast details, delete example episodes, deploy.

Development

Start auto-reload web server:

zola serve

Structure

  • There is no theme used, all HTML files are in the templates directory.
  • Content is stored as markdown files.
  • Episodes are stored in content/episodes/episode-name.md
  • Static pages are stored in content/page.md
  • Episode sound files are stored anywhere and linked in episode markdown files.

File hierarchy

$ tree
.
├── config.toml  # zola configuration file
├── content/  # markdown content files
│   ├── about.md  # static pages file (About page)
│   └── episodes/  # contains episode files in markdown
│       ├── _index.md  # zola file to designate taxonomy
│       ├── episode-1.md  # example first episode markdown file
│       └── episode-2.md  # another example episode
├── public/  # generated HTML files
│   ├── 404.html  # generated
│   ├── atom.xml  # generated RSS
│   ├── about/  # generated
│   │   └── index.html  # generated
│   ├── episodes/  # generated
│   │   ├── episode-1/  # generated
│   │   │   └── index.html  # generated
│   │   ├── episode-2/  # generated
│   │   │   └── index.html  # generated
│   │   └── index.html  # generated
│   ├── index.html  # generated
│   ├── main.css  # generated
│   ├── robots.txt  # generated
│   └── sitemap.xml  # generated
├── static/
│   └── main.css  # source CSS styles
└── templates/  # HTML files
    ├── 404.html
    ├── index.html  # main layout and index file
    ├── page.html  # template for static pages
    └── episode.html  # template for podcast episode pages

Deployment

One can deploy on a number of free services, eg. Netlify, GitHub, Gitlab, et al.

One can also deploy on their own server. There is an nginx configuration file using standard practices and configured with Letsencrypt SSL.

To generate the certificate, one can use this command with certbot installed:

certbot certonly --webroot -d podcast.com --email your@email.com -w /var/www/_letsencrypt -n --agree-tos

Note: One will need to comment out the SSL server directive before running the above command.

Screenshots

The index looks like this:

screenshot-index

The episode page like this:

screenshot-episode

License

Code licensed under MIT.

View on GitHub
GitHub Stars5
CategoryDesign
Updated12mo ago
Forks0

Languages

CSS

Security Score

82/100

Audited on Apr 9, 2025

No findings