Adding audio to a static site (Next.js, Hugo, Astro)
Static and JAMstack sites have no database and no classic back office. How to add an audio version of your articles cleanly, without betraying the architecture that makes them strong.
A growing share of content sites now runs on static generators: Next.js in export mode, Hugo, Astro, Eleventy, Gatsby. The principle is appealing and proven: pages are built at build time, served as plain files, with no database to query on each visit. The result is fast, robust sites that are cheap to host. But this architecture raises a real question the moment you want to add an audio version of your articles: where do you put the audio, and how do you generate it, when there is neither an application server nor a traditional CMS behind it?
Why static makes things slightly harder
On a classic site backed by a database, adding audio is often done on the fly: a page is generated on demand, you can inject a player and point it at a file produced in the background. On a static site, the page is frozen at build time. You cannot rely on server processing for each request, and you certainly do not want to regenerate an audio file on every visit, which would be expensive and would ruin the speed that made you choose static in the first place.
So the right approach is to reason the way the rest of your chain already does: produce the audio once, at the moment the content is ready, then serve it as a plain file, exactly like your images or your stylesheets.
Three ways to wire audio into a static build
The first, and most direct, handles audio at the build step. Your pipeline reads your Markdown files, and for each new article it triggers audio generation through an API, retrieves the URL of the produced file, and inserts it into the page data. The player is then present as soon as the page goes live, with no server call on the visitor side. This is the cleanest option for anyone who controls their build pipeline.
The second relies on the RSS feed most of these generators already produce. Rather than touching your build chain, you let an external service watch your feed, detect new articles and produce the matching audio. This is the approach we describe in detail in integrating audio into your articles, and it has a major advantage for static: it does not touch your code. How the feed works as a trigger is detailed on the RSS feed page.
The third, the most flexible for technical teams, goes through an explicit API call. You decide yourself, in a publishing script or a continuous-integration action, when the audio is generated, and you retrieve the URL to store in your content. The API and CMS page describes this route. It takes a little more upfront work, but leaves you full control over when and under what conditions generation happens.
The trap to avoid: generating on the client
A tempting mistake is to try to do everything in the browser, calling a synthesis API the moment a visitor clicks play. Avoid it. You would expose your keys, you would pay for a generation on every listen rather than once, and you would introduce an unpleasant delay. The healthy model stays the same: generate once at publication, serve a static file afterwards. Audio then becomes just another asset, cached by your CDN and served instantly.
What static buys you along the way
Well integrated, audio fits the static philosophy perfectly. The file produced once is immutable, versionable, distributable by the same CDN as your pages. No database to maintain, no server overhead, an operational footprint that stays as light as the rest of your site. This is, in fact, the same flat-file logic WeDispatch applies to its own blog, with no database, and it pairs naturally with a static generator.
The choice between the three approaches depends mostly on your team: the RSS feed to write no code, the API to control everything, the build step for the best of both if you already own your pipeline.
Try it on your own articles
The WeDispatch free tier lets you voice your content today, with your real text: start here. The plans, from 69 to 419 EUR excluding VAT per month, are detailed on the pricing page.
Give your articles a voice with WeDispatch
This blog is itself voiced by WeDispatch. Curious how it sounds on your content?
Book a demo