Skip to content

Dirtbag

Good bones and road grit.

Features

Dirtbag is a small WordPress block theme for plain publishing, old-open-web habits, and enough structure to go out for a rip without hauling a build system behind the truck.

The tool you need most is the one you have right inside your head. It is the ability to look at a machine, understand how it works, and realize that you, with your own ten fingers, can fix it.

Your Dad’s (or Grandad’s) copy of How to Keep Your Volkswagen Alive (1978)

What is in the theme

  • A default Brutalist mode that stays close to native browser and WordPress output, like béton brut — raw concrete.
  • Six CSS-allowed style variations: Minimalist, Newspaper, Terminal, Amber CRT, Blueprint, and Hi-vis.
  • Web-safe font stacks and colour palettes. Like a nuclear non-proliferation agreement, we won’t add more if you don’t.
  • Square buttons, visible focus states, native form controls, and current navigation states in the CSS-allowed variations.
  • A hand-drawn pickup-truck Site Logo that shows by default. It is the theme’s one piece of PHP — a small functions.php filter that drops the bundled truck into the header when no logo is set, then steps aside the moment you add your own (or a synced Site Icon). It keeps the mark on the truck even on a fresh install or the WordPress.org preview, where no demo content has run.
  • No bundled JavaScript runtime and no build step.
  • As little as possible, since WordPress and the browser do so much.

Templates

Dirtbag includes broad block-theme coverage, so WordPress has a plain road for most requests.

  • Core templates: index, home, front page, page, single, archive, search, author, category, tag, date, and 404.
  • A note-style single template for future short-form or IndieWeb note posts.
  • Custom page templates: no title, wide, centred, plain, colophon, now, links, feeds, and uses.
  • Post templates include previous/next links, Webmention invitation text, and comments.

The secret to keeping your classic Volkswagen on the road is simple: regular preventative maintenance and the use of correct, high-quality replacement parts.

How to Keep Your Volkswagen Alive

Patterns

The pattern set is meant to be inserted, read, edited, and understood without a design degree.

  • h-card profile
  • rel-me links
  • colophon
  • blogroll with XFN relationships
  • now section
  • post meta
  • previous/next post navigation
  • Webmention invitation
  • field note
  • roadside notice
  • accessible table
  • colour style demo panel
  • open-web links
  • comments

IndieWeb and old-open-web pieces

  • Microformats-friendly classes where block markup allows them: h-card, h-entry, h-feed, p-name, p-note, u-url, u-photo, dt-published, p-author, p-category, and e-content.
  • Visible posts RSS and comments RSS links.
  • A visible WordPress sitemap link.
  • An OPML blogroll file for feed-reader people.
  • XFN-style blogroll links for relationships between sites.
  • humans.txt and a placeholder security.txt.
  • Pages for Colophon, Now, Uses, Links, and Feeds.

Comments and responses

Posts use the core Comments block pattern: a comment title, a comment list, pagination, reply/edit links, and a comment form. If a site later installs Webmention or Micropub plugins, the theme already has plain response affordances without pretending to be the protocol.

Accessibility and behaviour

  • One main H1 per document.
  • A skip link points to the main content.
  • Primary and footer navigation are labelled.
  • Native controls are preferred over fake controls.
  • Tables use scoped headers and WordPress Table block figcaptions.
  • CSS-allowed variations include visible hover and focus states.
  • Long body copy remains left-aligned; centred and right-aligned bits are used sparingly.

Roadmap

Dirtbag adds no JavaScript frameworks or theme-authored frontend JS. Where a page needs behaviour, the first stop is no script at all, then WordPress core’s own Interactivity API — the OEM part already under the hood of blocks like the navigation overlay, enhanced pagination, and the image lightbox. Aftermarket helpers like Alpine.js are a later exception, not the next step.

  • v1: No theme JS. Current state: HTML, WordPress core blocks, CSS style variations, and native browser behaviour. Where a core block needs behaviour it uses WordPress core’s own Interactivity API — the navigation overlay, enhanced query pagination, and image lightbox — each falling back to plain HTML.
  • v1.1: Tiny vanilla JS only if approved. Possible progressive enhancements include copy-permalink buttons or small page-local helpers. No build step. Load only where used.
  • v2 candidate: Cab Light. An opt-in HTML + CSS + JS mode for carefully approved interactive bits, reached only after WordPress core’s Interactivity API has been ruled out for the job. If an aftermarket library is ever added, a super-lightweight one like Alpine.js is the likeliest candidate because it keeps behaviour close to markup.

The first rule is still: “HTML when HTML works.” Do not add a build system. Do not load a runtime just because it is sitting there with its boots on.

What is deliberately not here

  • No theme dependencies added in version one. WordPress core still loads its own assets when core blocks need them.
  • No theme-authored frontend JavaScript.

That is the whole rig: blocks, comments, feeds, OPML, XFN, microformats, accessibility notes, colour styles, and a hand-drawn truck icon.