A few years back, back when I was rebuilding the Science On a Sphere website, I had the idea that you could use a static site generator (SSG) like Eleventy to write out PHP instead of HTML. I had been eying Eleventy’s edge plugin and wishing it was available for hosts other than Netlify when it occurred to me that the edge plugin really isn’t that different from how PHP works:
- Part of the page is marked as dynamic and is not rendered at build time
- A request comes in to the server for the page
- Eleventy spins up and runs the remaining template scripts in the page to build the final version of the page specifically for that request
So really, you don’t need the edge plugin for Eleventy, you can replace the edge
shortcodes in your templates with <?php ?>
tags and configure Eleventy to default to writing out all pages as .php
instead of .html
(or configure your webserver to treat .html
files as PHP). Now you can give any part of your static pages dynamic content that is rendered by the server upon request!
I had been planning to implement this for some features on my website before writing about it so I could discuss the process and its problems more thoroughly, but lately my time for, and interest in maintaining this website has been waning, so I figured I’d just throw this out there to see if anyone else wanted to run with it.
Uses for PHP in Your Static Site
Updated . The following examples are what Hugo Landau calls mildly dynamic websites. I think this is an excellent term, and he does a good job explaining how good PHP is for incrementally adding some dynamic bits to your website.
Theme Selection
Toggling light-/dark-mode on a static site is typically done with some JavaScript. Now this is the kind of the thing that I think JavaScript is pretty good for because if the JavaScript doesn’t run for any reason, you still have a perfectly good site that (hopefully) at least respects the operating systems light/dark settings. Still, doing this with a <form>
element and a server-side process that simply sets a cookie in the browser and can dynamically load different stylesheets for the theme will work for everyone and can be progressively enhanced with JavaScript (to avoid a full page refresh when your visitor changes the theme).
Webmentions
I think the most common approach to webmentions that I’ve seen on static sites is to have a scheduled build of the site once a day that will be sure to get any new webmentions that have come in in the past 24 hours. Alternatively, you could imagine fetching and rendering webmentions from an API using JavaScript in the client.
What I don’t love about the first approach (which is how I used to handle webmentions, when I supported them) is all of the unnecessary builds of the site from scratch. I never got a lot of webmentions, so rebuilding the site every 24 hours just in case seemed kind of wasteful. And the second approach has the same problem all JavaScript-based approaches have: if JavaScript fails, this feature is unavailable. Much like the theme selection, this isn’t a huge deal, so it strikes me as a reasonable use of JavaScript.
Of course, another problem with the JavaScript-based approach is that you are using the CPU — and potentially burdening the battery — on your visitor’s device to load and parse the webmentions, whereas with a PHP-based solution, that work can all be done on the server (and cached for some period perhaps).
Search
And finally: search. Another feature which I often see implemented with client-side JavaScript for static sites; although you can also just use a form that queries a search engine like DuckDuckGo and include site:https://darthmall.net
or what have you in the query. But if you have PHP working on your site, you could pretty easily use your static site generator to write out some kind of search index, and have yourself a good old fashioned search.php
page that generates the search results for you so that you have an on-brand search results page and a search that works without JavaScript.