#64 – Patrick Posner on Using WordPress To Create Static Sites

Transcript

[00:00:00] Nathan Wrigley: Welcome to the Jukebox podcast from WP Tavern. My name is Nathan Wrigley.

Jukebox is a podcast which is dedicated to all things WordPress, the people, the events, the plugins, the blocks, the themes, and in this case using WordPress as a way to create static sites.

If you’d like to subscribe to the podcast, you can do that by searching for WP Tavern in your podcast player of choice. Or go to WPTavern.com forward slash feed forward slash podcast. And you can copy that URL into most podcast players.

If you have a topic that you’d like us to feature on the podcast, I’m keen to hear from you. And hopefully get you or your idea featured on the show. Head to WPTavern.com forward slash contact forward slash jukebox. And use the form there.

So on the podcast today, we have Patrick Posner. Patrick is a solopreneur and has been developing with WordPress since 2010. He’s worked in all sorts of environments as a freelancer, a senior developer in a WordPress product company, and since 2020 he’s been working full-time on his own projects.

One of his projects is a plugin called Simply Static. It’s purpose is to make a static version of your website. This of course begs the question, what is a static site?

Back in the early days of the internet, before WordPress, if you wanted to put a website online, you had to write the HTML yourself. You opened up a text editor and started to type. When you’d finished, you had an HTML file which you uploaded to a server somewhere. And if someone wanted to view that page, the server would send over that file.

It worked, but thankfully, it didn’t stay that way for long. Software for desktops were developed, which would create the HTML for you. CMSs such as WordPress would take this further and create the HTML and CSS based upon the content you’d created, and the theme that was active. This was extremely convenient, but when all is said and done, the output is still the same as it was years ago. HTML, CSS, and possibly some JavaScript.

Depending upon your setup in WordPress, quite a lot of complicated operations are needed to generate that code. Caching aside, is there a case for saving your HTML files, uploading them to a server, and then taking WordPress offline? Patrick certainly seems to think so.

We talk about how this flattening of your website takes place, and what the advantages might be in terms of speed and the cost of hosting.

We also get into the pros and cons of adopting the static site approach. Are there any sites which are more suited to being static than others?

We also discuss what solutions are out there to make this happen, from Patrick’s own plugin, to the hosting providers and SaaS solutions which enable things like search and forms to still function.

It’s a really interesting subject and one that you might like to explore, and this podcast is a great primer for that.

If you’re interested in finding out more, you can find all of the links in the show notes by heading to WPTavern.com forward slash podcast, where you’ll find all the other episodes as well.

And so without further delay, I bring you Patrick Posner.

I am joined on the podcast today by Patrick Posner. Hello Patrick.

[00:04:16] Patrick Posner: Hey Nathan. Glad to be here.

[00:04:18] Nathan Wrigley: Thank you so much. This is honestly going to be a really interesting topic. I think there’s going to be a lot of people at the end of this conversation who go away and start to fiddle with their setup. Because we’re going to be talking about a really different way of serving up your website.

We’re strictly in the bounds of WordPress. Everything that we’re going to be doing today is WordPress, but we’re going to add a little bit of a twist, and this is the way that WordPress is served up to your clients.

Patrick is the owner and developer of a plug-in called Simply Static. I’m going to link to it in the show notes. There is a version on the WordPress repo, which is available for free. There is also a paid version and we’ll get into all of the different pieces of that. So we’re going to be talking about static sites today, essentially. Ironing out the problems, figuring out what it all is and what Patrick’s solution does.

Before we begin that, let’s go into Patrick’s origin story. Patrick, if you wouldn’t mind, just tell us about your relationship with WordPress. Tell us where you are, what you do for a living, how long you’ve been doing it, and all of those good things.

[00:05:25] Patrick Posner: Yeah, sure. Happy to share. So I’m a WordPress developer since 2010. And I moved from several steps into the career I’m having today. I started with an agency as a developer, building client sites. And, after a couple of years I moved into self-employment and started getting some freelance clients. Building my first WooCommerce stores and more advanced WordPress websites.

After a bunch of years I got employed again and worked as a senior plugin developer for one of the biggest WordPress product companies here in Germany. Just before Covid, I decided to get back to self-employment again, and since then I’m working full-time on my WordPress products, mainly plugins.

[00:06:16] Nathan Wrigley: Thank you very much. You’ve got a website which people can find. It’s patrickposner.dev, and I will link to that in the show notes, but you can see the range of different things that you are doing over there. But we’re going to be focusing very much on one of your endeavors, which is a static site generating plugin.

We’ll get into how it works, that particular plugin in a moment. But I think first of all we should clear up what a static site is. So just to reiterate, we’re using WordPress, but there’s something different about the way that WordPress distributes the pages and posts that we save. So, could you describe to us, any amount of detail, I guess, considering this is a WordPress specific podcast you really can go into the weeds with this if you like. But just tell us what is a static site? What are the benefits? Why should anybody making WordPress websites be interested in this?

[00:07:12] Patrick Posner: So imagine stepping back 20 years. The internet consists of HTML, CSS and JavaScript. You have no database interaction. You have no complex server setups, just plain files. You can edit them directly, you can upload your images, PDF files and other stuff. That are static websites.

And as the world and especially the internet is getting more and more complex, people are really enjoying the ease of static websites, as they don’t have to handle with updates with a database, with complex deployments and all that stuff. So that’s a basic idea of static websites.

They don’t have a database. They are pretty secure and almost unhackable as they have no connection to a traditional server. So there’s no PHP exploits, having no database where people can or where hackers can fetch your user data, or install any malicious code or something like that.

Another really beneficial thing of static sites is a part of hosting. So you can basically host a static site everywhere, on a pretty cheap standard web hosting package. But there are also a bunch of more optimized hosting providers like Netlify or GitHub Pages, which cover a couple of common problems. We may get into detail a little bit later for that. But, let’s say 404 pages or a search integration or basic form integration, where people can submit the form and the content of that is forwarded to you via email.

[00:08:56] Nathan Wrigley: Yeah, so just to rehash a bit of that and go into the weeds on some of the bits and pieces there. So you mentioned that 20 years ago, I remember it well, actually. If you wanted to browse a website, essentially you would go to the url, and if you inspected the source code, you would just see a list of HTML, there may be some CSS in there and so on, and perhaps some images were linked to.

But typically that HTML would’ve been written by a human probably. They would literally line by line, have gone through and written the whole thing. And the only thing crossing the wire was the HTML. So the page that you requested was a file.

You would request index.Html and the internet, wherever that was served, would give you that file. That file was somewhere. Fast forward 20 years, now we’re into WordPress territory. And again, there’s a whole broad spectrum of people that listen to this podcast, and some of them may not be aware that the moment you request a WordPress page, a whole litany of very complicated things are going on in the background, depending on how many plug-ins you’ve got and what it is that you’re requesting. But it’s not as simple as I request a page, WordPress serves the page. No, there’s a whole theming engine and all sorts of database requests are being built on the backend at the time you request them.

Now, typically, you know, if it’s a really lean site, you might not notice that it might be very, very quick. But when you start to do more complicated things, the time it takes to build that page adds up. So what you are proposing is that you can still use WordPress, but the output is saved and it’s the output which is served up just like it was 20 years ago. Have I got that roughly right?

[00:10:52] Patrick Posner: Perfectly perfectly. So that’s exactly what the static site generation does within WordPress. You can edit your content in WordPress, but the result is just a static website.

[00:11:05] Nathan Wrigley: Okay, right. So hopefully we’ve cleared that bit up. Now you mentioned that there’s whole bunch of benefits to this. Number one, I think, really would be the speed. The fact that there’s nothing being constructed by WordPress. So seconds, milliseconds. I don’t really know. It depends on each individual instance of WordPress.

But the point is, there’s nothing complicated going on the background. You request a file, a file is served back at you, and so that’s quicker. Now, along for the ride there is also the security benefit. And you said that these websites are typically unhackable. And again, that might be a mystery to people. Can you explain why the security posture is improved by going static.

[00:11:52] Patrick Posner: Yeah, sure. So security is often overlooked when it comes to static websites. But for me, that’s as important as the performance aspect of it. So you have basically a layer before your WordPress website. So you have your WordPress website, and the entire website is protected by basic authentication, for example. Or even better, you have your WordPress website on your local computer with a tool like Local WP, and your WordPress website don’t even touch the internet directly.

And you convert the WordPress website to a static website. And this static website don’t have access to your WordPress database. There’s no ability to execute PHP, for example. So there’s no one that can access your server and do anything you don’t want.

That starts with forms. So someone submits like malicious code in your form, and the input isn’t really escaped. So it doesn’t matter on a static website as you never have the problems that someone submits a form and it will be directly transferred to a WordPress website.

The same is true for executing code. So if you have a static website, there aren’t any PHP files, and most statics hosts even block PHP files from executing in general. You will never have something like a malicious script on your aesthetic website that sends spam emails or collecting user data you don’t want. All of that is gone once you have a static website.

[00:13:30] Nathan Wrigley: So you mentioned the scenario where, and I would encourage people to explore this a little bit, because it’s quite an interesting scenario. You mentioned that you could use a local install of WordPress. And so you may, for example, have come across a tool like Local, which is a desktop application. So you can download it for the Mac and windows and so on. There may be versions for Linux, I actually don’t know.

But you can have a local version of WordPress and really, it only works on your machine whilst your machine is switched on. The principle being that you may use it just to test out a plugin, or you may use it just to test something out that you want to do quickly. You can spin up a website, but that website doesn’t really have an online presence. If you switch your computer off at the end of the day, it’s gone, it’s nowhere. It doesn’t exist.

But in your scenario, you can create your website on your local machine. Then export the pages because you’ve essentially scraped the output HTML and figured out where the CSS and the files are and so on. And then you could push that to the server and then shut your computer down and the website will still work. But there’s absolutely no database online. There’s no PHP files getting requested, and so in that way, it’s more secure.

[00:14:49] Patrick Posner: Yeah, absolutely. Also means that you have like a staging environment automatically. So your WordPress website is your staging website, right? So as long as you don’t push an update to your static website or to your hosting, you can do whatever you want with your WordPress website. Installing a new plugin, testing a new theme. Updating or not updating WordPress is also fine. Your static website stays online no matter what.

[00:15:17] Nathan Wrigley: Yeah, it’s a real one way relationship, isn’t it? Whatever is on your WordPress website is always in isolation, if you like. And you have to publish the changes and push them to the server. So in that way, nothing comes back because the server really, in a sense, has no knowledge of the fact that there’s a WordPress website. It just knows that, well somebody’s requested a particular page. Have I got that page? Yes, I have. Here it is. It doesn’t know that there’s a WordPress website there at all.

[00:15:51] Patrick Posner: Yep, that’s right.

[00:15:52] Nathan Wrigley: Okay, and you mentioned another benefit of this approach was the fact that it can be hosted, and my understanding is that can in many cases, depending on the size and scale of your website, it can be hosted really, really affordably. And by affordably, I mean incredibly affordably. Now, I don’t know if there’s a dozen, hundreds of companies which are dedicated to this type of environment, but can you just talk us through the sort of cost benefits of doing it this way? Static.

[00:16:24] Patrick Posner: Yeah, true. So, hosting a static website is completely different when it comes to the pricing tag attached, compared to any kind of a press hosting. We’re talking about like $1 for an entire year of hosting.

There are also a bunch of providers that you can use for free, like Cloudflare Pages. Cloudflare Pages allows you to do like, I’m not entirely sure, it’s 500 updates to your static website per month for free. They don’t charge for the amount of files or the used data, the used space. So that’s one thing that you can use completely for free. There are others where there’s a little fee attached, but it’s always insanely cheap compared to traditional WordPress hosting.

[00:17:16] Nathan Wrigley: You literally are in many cases talking about a handful of US cents, not dollars per month.

[00:17:24] Patrick Posner: Yeah.

[00:17:25] Nathan Wrigley: Yeah, it really is amazing. You mentioned earlier that the hosting company does take on a slightly different burden, in that because it’s just pages and that’s all they know about, then some of these hosting companies do take on additional responsibilities. So for example, in the scenario where somebody accidentally searches for a url which doesn’t exist.

Well, WordPress, if you’ve got a traditional WordPress site, which is online with a traditional host, it handles that and it serves up a 404 page. Plus it can do things like search for you. That’s not the case here. And you have to take additional steps for those things to be catered for. So 404, search, things like forms. Do you just want to talk us through how you overcome those things?

[00:18:10] Patrick Posner: Yeah, so you can, there are two different directions you can go here. You can do it yourself. It’s not that hard to provide an htaccess file to serve the request to a specific page. That’s one way. So there are a lot of users, especially in the Simply Static world, doing all of that on its own.

But you can also use a provider like, let’s say Netlify. Netlify provides an easy way to configure a 404 page, and they handle all of that for you. So you basically type in a search and if there’s no result coming up, Netlify will handle the redirection to the 404 page for you. They also handle things like forms. So you can basically add a little ID into your existing form, and they will forward the submission to your email address that you also configured within Netlify.

There are a bunch of solutions for different use cases. You can always decide to use a more like all in one solution like Netlify, or use your traditional hosting package and use services like Formspark. Formspark is a static site form tool. You can easily configure forms on Formspark and embed them. You get a little HTML snippet. You can embed them on your WordPress website and they handle all of that for you. Spam detection, forwarding, CC, BCC connections, automations with Zapier. So let’s say you want to, you have a, like a, newsletter form and you want to, each time someone submits the form, you want to automatically submit this user to your Mailchimp list.

You can do that with Zapier or within Formspark. I’m not really sure, but I think Formspark even have a automation with MailPoet right now. So there are a bunch of ways you can handle that. And all of them, or most of them, don’t require to be like a professional developer or something like that.

[00:20:12] Nathan Wrigley: Yeah, I guess that’s an important point, isn’t it? So there are many benefits that you can list. You know, it’s quick, it’s secure, it’s affordable. But there’s also a few little additional hurdles. You have to in some way manage search. In some way manage 404, and forms and so on. And, it sounds like the industry around static website hosting is beginning to mature to the point where there are off the peg solutions.

So you mentioned Netlify can configure it so that 404 is taken care of. You don’t need to necessarily manage that yourself. And again, you mentioned a SaaS service, which will deliver forms to your email address. And I’ve had a little bit of a play with Formspark, and in all honesty, it was trivially simple to stick up a form and get it sending the data that was consumed by that form to my, my email address, it only took a matter of moments. It was really good.

So, what we’ve talked about there is what a static site is. And because you’re on the podcast, it’s clear that you’re into that area and in fact, you’ve got a solution to turn a WordPress website into a static website. It’s called Simply Static. I’ll link to both the paid version and we’ll go into the differences a little bit later, but I’ll also link to the WordPress repository version, which will get you certainly going. Tell us what simply statics approach is. What is it doing? How long have you been working on it? Is this yours? Did you take it over from somebody? Just give us the rundown of what is Simply Static.

[00:21:46] Patrick Posner: So Simply Static is a static site generator as a WordPress plugin. It basically acts like Google or a regular user. So, once you start an export within Simply Static, there’s a crawler behind it that visits each page on your website and downloads the entire HTML rendered, and all the CSS files, JavaScript files, and of course all the images.

And, at the end, it zips the entire results. So you can use it to upload it, for example, to Netlify. I adopted the plugin in 2020 from Scott Blaine, who does an incredible job putting together the initial version of Simply Static. I got in contact with Blaine due to the fact that I was a user of the Simply Static plugin, and I used it for a client website where we had problems that we hadn’t full control over the server configuration.

It was like a traditional hosting package. And the client booked a TV commercial and we expected a huge spike in traffic for that day, and we need a way to handle that. So nothing could be worse. And once TV commercial was out the landing page would simply get away. And so I would never restart again once TV commercial was on. So, I stumbled upon simply Static and it wasn’t working at that time, but I thought, okay, so working as a WordPress developer for like 12 years, I should be able to make it work.

And, I fixed the problems in like one or two hours and provided a patch and Scott implemented that one and we got in a little discussion about the future of Simply Static and he told me that he was having his third or false kid, I’m not really sure, and he don’t really have the time anymore to maintain or even extend Simply Static from now on.

And I thought, okay, so I’m working on my own products for like six years or seven years and I really, being a fan of complex products. So my other products like Password Protection or Secure File Transfer, it’s always something a little bit nerdy and I thought, okay, Simply Static is a pretty good fit for my existing portfolio, so why not taking it over and shipping all the patches, all the features people were requesting for years. And yeah, that was almost two years ago, or two and a half years ago, I’m not exactly sure. So that was the short history of how I get into Simply Static.

[00:24:31] Nathan Wrigley: Perfect. So you took it over and ever since 2020, it’s been under your stewardship. And you just described that when you click publish in the same way that Google go around the internet and capture what is on your webpage, they’re not literally, well, they probably are as well, but typically they’re not taking an image of what’s on your page, they’re looking at the source. So they’re looking at the HTML and any other things that might be attached via that HTML.

And essentially that’s what your plugin does. If you’ve got a brochure site, let’s say it’s got 10 pages. When you click the button in Simply Static.

[00:25:08] Patrick Posner: Generate.

[00:25:09] Nathan Wrigley: The generate button, thank you. Then it will scrape those 10 pages and put it into a zip file. That zip file, in the free version, you then take to a hosting provider and we keep talking about Netlify, so we may as well go with that. Take it to Netlify, upload it, and it’s then live, you’ve got your new iteration. So it’s a process of creating your WordPress website, saving things as you would normally, clicking generate, carrying the zip file over to Netlify, putting it over there, and then from that moment on the world, if you’ve got your DNS set up correctly, is looking at the flat html, the static HTML files, that simply Static has generated. Is that right?

[00:25:55] Patrick Posner: Correct.

[00:25:56] Nathan Wrigley: Perfect. How is the project going? You know, you’ve had it under your stewardship for a couple of years. It feels like static sites have become a bit of a hot topic. So I’m imagining that the plugin is experiencing growth.

[00:26:10] Patrick Posner: Yeah, so Simply Static had a huge growth within the last two years. We almost 4x’d amount of active installation. So at the moment I took over the development of Simply Static was like 10 K active installations. We are now reached 40 K active installations. One thing I’ve done on day one, as I took over Simply Static and the GitHub repository was switching it to public.

So it’s really a community driven project. You can always check the entire code base on github.com/simplystatic. And, you will find a little roadmap. You find issues we are working on. You can provide pull requests. Or you can make suggestions for new integrations or things that may not be working as expected.

So we had that case with Elementor last week where Simply Static isn’t able to extract the bundled js that Elementor is generating to improve the performance. And we handle all of that, try to be as open as possible about the future of Simply Static. How things are going. Which direction we are going. Why I do things the way I do.

So, for example, the crawling part, there are other solutions that do it more in a WordPress way. So they fetch all the custom post types and the generated archives and things like that. And it’s a valid approach, but I thought SEO is such a popular thing today and why not work as close as Google as possible to give an expected result once you generate a static website.

So see it through the eyes of Google, and the eyes of your users and make sure your content is linked properly. You are having valid URLs. You are not having a bunch of 404 errors on your website. All of that is things Simply Static is taking care of to make the export as easy as possible.

[00:28:17] Nathan Wrigley: It’s interesting because you and I are both obviously deeply embedded in the WordPress community. We love it and we probably obsess about WordPress more than is healthy for us. But a typical, I’m plucking this out of thin air, but I’m imagining there’s some truth in what I’m about to say.

I would imagine a significant proportion of implementations of WordPress could really benefit from being static. And what I mean by that is, they are literally a site which is not really getting updated. It was built for let’s say a small business. And, that small business, they just need an internet presence. They need to be out there. They need a contact form. They need some description of what it is that they offer. Something fairly straightforward.

The users of that, there’s a possibility that they don’t want the burden, because the internet is not what they do for a living. They don’t want the burden of having to renew licenses. They don’t want the burden for having to update plugins. They don’t want the burden for updating WordPress when it reaches the next version and so on. And I suppose in a sense, your solution kind of obviates that a little bit, because you don’t really, now, forgive me for saying this, because everybody will probably shoot me down for this.

The site would still be secure, serviceable, workable even if you didn’t do all of the updates. So long as when you save it and generate your file, even if you’re on a really, really old version of WordPress, so long as the HTML that comes out the other end is valid and works, you are fine..

[00:29:52] Patrick Posner: Yeah, absolutely. So one thing I keep saying to, a lot of users and customers is, let’s take WordPress offline in a good way. So we can use WordPress as one of the best tools to create a website. That can be on your local computer, on a protected environment, somewhere hosted. And can be sure that the results exported statically is still secure.

Even if you don’t update or you don’t update your plugins regularly, you don’t update WordPress each time. You may not even update your theme out of a fear that it may break something. And all of that is covered by Simply Static due to the conversion. So use WordPress as a powerful editor for your website and use Simply Static to have peace of mind that your website is fast and secure even if you don’t get that much involvement in the WordPress world and you are always on track on all the security vulnerability reports and what’s new on Google page speed and all of those things.

[00:30:59] Nathan Wrigley: It’s, really interesting. I’m just thinking about appliances in my kitchen. So an example would be my dishwasher. I don’t want my dishwasher to be on when there’s no dishes that need cleaning. It just needs to be off. Turn it off, then periodically go back to it and when it needs it, switch it on. And then once it’s done, switch it off again. It’s the same sort of principle here, isn’t it?

WordPress, as on off-able. You switch it interact with it, publish the changes, get the changes onto the hosting in some way, and we’ll talk about the different methods in a moment, and then turn it off again, and remove any of the things that WordPress being switched on all the time may bring with it. Yeah, so I really like your description of it there.

Now, just moving the subject forwards a little bit. Static sites, I feel that the word static sites and headless are being used a lot at the minute. And in many cases there may be confusion that these are in fact the same thing, that a static site that we are talking about today is the same as headless.

Now it’s not really true, and I wonder if you could describe the differences. We could really go into the weeds here, but I don’t think we’ve probably got time for that. So a simple description of how they differ would be good.

[00:32:11] Patrick Posner: I think simple is the best way to describe the difference between headless and static websites. So a headless website is more like a technical challenge. You usually have your WordPress website online somewhere all the time when you run a headless setup. The headless website continuously makes use of the REST API for WordPress to fetch content. To submit forms. To do all of dynamic stuff, but with JavaScript and not with PHP.

And, one of the problems with headless website is that you almost ever need to be a developer or you have a developer maintaining your headless website. And that’s not the case with static websites due to the static generation, you can be pretty much anyone, and use the benefits a headless site offers without the technical challenges involved.

And you can even use, and that’s a huge point for a lot of people, use your existing theme. So headless websites tend to be built from scratch, mostly in an enterprise context, and the theme is built with JavaScript and a modern JAMstack. So things like React are involved, Next.js, just to name a few of the tools involved in the stack.

And they are complex and far away from end user friendly. A static website you use the tools you already know, but you get the benefits of a headless website. So the security improvement and the performance.

[00:33:44] Nathan Wrigley: Yeah, I think it’s important to say that both implementations, static and headless, they really do have benefits. There’s clearly benefits that you’ve described for static and clearly there’s benefits for the headless approach. And as you described, enterprise level clients, and the fact that they may have access on tap to developers is a possible requirement there. I mean, you may be an incredibly technical non-developer, but I would imagine that it’s true to say that static sites are a little bit more straightforward to implement.

Okay, with that in mind, let’s go through some examples of places where static sites are a good fit. And it is very important to say it’s not always the case. There is definitely going to be some examples where switching WordPress off is not what you want to do. So let’s do this in two ways. Let’s do the good first, let’s have some examples where being able to turn WordPress off using a static site is a good fit. Let’s do that first.

[00:34:46] Patrick Posner: Sure. So, a good fit for a static WordPress website is a corporate website. It’s the most basic example. So yeah, traditional WordPress website for your plumbing service or whatever you do for a living. These sites are a perfect case for static sites. They rarely change. They don’t have any highly dynamic interaction with the WordPress website. You export them, leave them online, and that’s all you need.

Another good example are blogs. So you can serve your entire blog as a static website and use little tricks to make something like comments work. So there are a bunch of tools and they are not that expensive to make comments work on your static website. You can publish new articles quite easily with Simply Static. So that’s a good case too.

There are more specific types of websites that are also good fit. Think of documentation websites, where you add or improve the copy of the documentation, but you rarely switch the entire design, for example, for a documentation website.

Another good fit are landing pages or lead generation websites. Think of AdWords landing pages or just an SEO landing page optimized for a specific keyword. Those pages are mostly small, so the static export is quite fast. And you don’t have to worry about updates or is my lead generation form working and all of that.

Another thing that is often offloaded from the traditional website, and is more common in an enterprise context are career and department websites. So you have a separated career portal for all the jobs you are offering or you’re planning to offer to start a new department. And these pages are often separated from the main website. So like department-x.my domain.com, for example.

[00:36:45] Nathan Wrigley: Yeah, perfect. So essentially what we’re saying there is, if the site is more or less static, then it’s a definite fit. So a corporate website. But even if it’s being modified, not necessarily being modified every few moments, then a blog for example. This is perfect. So all of those scenarios are a perfect fit. If you can say that you’re going to modify it not every moment of every day, then it seems to be a good fit.

But that leads us onto the areas where potentially it’s not a good fit. And really this is where the dynamic stuff comes in. Any website which needs access to the database because it’s doing database intensive queries, that’s probably the area where it’s not such a good fit. So let’s go into the not good fits then.

[00:37:30] Patrick Posner: So what the dynamic is key here. So there are a bunch of types of websites that obviously aren’t a good fit for a static website. The most common one is eCommerce websites. So think of WooCommerce as the most popular eCommerce solution for WordPress. You don’t really want to run a WooCommerce store as a static website. People need to be able to add things to their cart. They need to be able to log in to their customer account to download invoices or review their orders, and all of such things. I mean, you can do that with a static website, but it’s really a challenging part and you don’t want to do that.

Another common thing, especially in the last couple of years are membership or community websites. So all kind of websites that really are highly interactive. People commenting. People sharing. There are subtypes of that like, forums or you even use like BuddyPress to have your own little social media space or corporate intranet where people discussing topics and you don’t really have a control over the publishing. There are a lot of users, high interactivity. It wouldn’t just make sense to publish a static version of a forum thread each time someone submits a new reply to it.

[00:38:48] Nathan Wrigley: You imagine things like LMSs and e-commerce websites, where more or less everything that the end user wishes to do involves sucking something out of the database. So yeah, I can see why those scenarios won’t work. So that’s a nice clear definition. There’s definitely good fits here and there’s areas where, yeah, you probably could make it fit, but really, at that point you’re probably needing to really push the boundaries a little bit.

In terms of the product that you’ve got, so Simply Static,. You have a version on the WordPress repo, but you also have a paid version. Typical case is, if there’s a paid version, there’s probably some extra features. Would you just like to outline the difference between what you have to do with the free version and what you can do. We’re recording this at the beginning of 2023, so caveat emptor, things may change, but at this moment in time, what’s the difference between the two different products that you offer?

[00:39:44] Patrick Posner: Sure, happy to clarify that. So, Simply Static Pro works kind of like an add-on to Simply Static. And, the major difference is the convenience and the amount of automation provided. So while you can use Simply Static in the free version to generate a static version of your website, getting a zip and uploading it to Netlify. Simply Static Pro offers automation.

That means you can connect Netlify directly, or you can connect services like Bunny CDN directly. And you don’t even need to log into Netlify to publish a static version. You can just simply use the generate button. And once you set up the configuration, everything is automated. So you generate the website and the files are automatically transferred to Netlify.

There’s also a point of convenience in the ability to export subsets of your website. So you do a full static export at the start and you have your website running on Netlify and you just want to publish a new post. Or you want to export a collection of pages with their images based on a taxonomy, for example. This is where also Simply Static provides additional features, like single exports and build exports. Build exports, work like a taxonomy. You attach posts, pages, images, additional files, and you can export the entire subset with a simple click of a button. These are two of the main reasons people are using Simply Static Pro.

Another thing is the idea to avoid external services as much as possible. That’s why Simply Static Pro’s also shipping with a forms integration, for example. We’re currently supporting Contact Form 7 and Gravity Forms, but we also figured out ways to use Elementor forms or Formidable Forms and a bunch of others. To use them without a service like Formspark we mentioned earlier.

The idea is that your WordPress website is on a protected area and Simply Static Pro is forwarding the requests from your static website to your dynamic WordPress website by authenticating and submitting it back to WordPress and receiving the request on the static website with JavaScript, where I have a similar approach with the built in search integration.

So Simply Static Pro ships with two different tools to make search work. One is fuse.js. It’s basically dependency-less JavaScript solution for search. We’re building json file, it’s a physical file on your server that contains all the search results that are available as content on your website.

We’re fetching the titles, the description, and the complete, the full HTML content of each page. Storing that on a physical file and once a user starts typing the search, there is a auto complete feature suggesting results. User clicks on it and the search integration handles a redirection to the correct page.

There’s another integration with Algolia. Algolia is a paid service. It’s like an online search solution, which is quite powerful as they handle fuzzy search and synonyms for you or typo tolerance search. So if someone types in a keyword of a typo, Algolia makes sure that he still finds the correct content.

But in the end it works the same way. The major difference here is that Fuse.js has a physical file, which I wouldn’t recommend for a pretty huge website, but it’s fine for a standard website. So if you have like a simple corporate website, you can feel free to use Fuse.Js. But if you have like 150 K pages corporate website, I wouldn’t recommend Fuse.Js as a json file. I mean, you can imagine that the json file is adding up in size pretty quickly if you have 100,000 results stored in there.

That’s where Algolia comes into play. Algolia is also really cheap. So you pay nothing for like 10 K searches per month and I don’t know, $2 for an additional 10 K search results. So it’s not a huge cost attached to your static site overall cost.

[00:44:14] Nathan Wrigley: The number one thing that I take away from that is the pro versions really is adding, for the typical user, it’ll be adding convenience. The ability to, if you like, sync your WordPress website with wherever it’s hosted. So rather than having to download a file, take it over and upload it, you just click a button and the plugin takes care of that. Makes a decision about what it is that needs to pushed over and so on. So, yeah that’s really interesting.

Patrick, we’re running out of time, but just very briefly, last question really is all about the future. You’ve obviously had experience of this now for two years. It sounds like you’re in it for the long haul. What have you got in the pipeline? What’s on the roadmap for the next period of time?

[00:44:56] Patrick Posner: Yeah, so I just finished the roadmap for this year for Simply Static. So a bunch of things planned. One thing I’ll be launching simplystatic.com next month? Yeah, I think it will be next month. And it will contain all information collected for Simply Static and Simply Static Pro. All tutorials, a free course on how to use WordPress as a static site generator that I’m just in the middle of the production phase.

We’ll also improve the onboarding for new developers and optimizing the way of contribution on GitHub. That means writing guides, how to contribute, offering documentation, how the code style is working, and what we expect from a commit or pull request. Offering a bunch of new issues to pick from. I got quite a lot of inspiration from the WordPress project itself. So you can imagine finding things like good first issue. In the future on the GitHub repository of Simply Static.

There’s also a huge relaunch plan for the entire admin area of Simply Static. I’m already six month in a new ui ux concept for Simply Static. I try to completely modernize the look and the feeling of Simply Static and the configuration, and simplify a lot of the those things to make it easier for end users to use Simply Static, and get all the benefits without knowing about what is GitHub or what is deployment or things like that.

So, easier wording, easier configuration. A little wizard that asks a couple of questions and preconfigures Simply Static for you, to make it as easy as possible. There’s also an ongoing task that we have pretty much like every WordPress plugin out there. So we like to improve the integration with popular plugins like Elementor, SEO plugins.

This week we just shipped a huge update for the Simply Static free version. That contains an automation for XML site maps. So we automatically check which SEO plugin you use, finds the XML site map and add it to the static export so you don’t have to even know that you have a XML site maps, as long as you have a SEO plugin installed and basically configured, Simply Static will now be able to pass the XML sitemap and extract all URLs provided there.

We’re also planning to build an official integration with the really popular Autoptimize plugin, make the HTML, CSS minification and bundlings that Autoptimize offers work with Simply Static without any additional configuration.

[00:47:38] Nathan Wrigley: Sounds like there’s a lot.

[00:47:40] Patrick Posner: I’m always planning a lot, but I also onboarding new people to the team. So, there’s a developer helping me right now with the Simply Static tasks and I may be able to onboard an additional developer, or maybe if someone is willing to lose the job, someone helping with support.

Feel free to reach out if you are a technical person and maybe not a developer, and you would like to help with customer support for Simply Static. So I would really appreciate it.

[00:48:10] Nathan Wrigley: Perfect segue Patrick, because the final question I want to ask is how do people contact you? Where are you online? That could be anything you like, an email address, obviously your contact form page on your website, but Twitter handle. Whatever you like.

[00:48:23] Patrick Posner: Yeah, so patrickposner.dev is my website. You find all the information about Simply Static and Simply Static Pro here. And you can always reach out to me at hello@patrickposner.dev. I’m also quite active on Twitter, so @patrickposner_. Don’t ask me why there’s an underscore. That’s the two best ways to reach out to me.

[00:48:47] Nathan Wrigley: Patrick Posner, thank you very much for chatting to me on the podcast today. I really appreciate it.

[00:48:52] Patrick Posner: Thanks for having me.

On the podcast today, we have Patrick Posner.

Patrick is a solopreneur and has been developing with WordPress since 2010. He’s worked in many environments, as a freelancer, a senior developer in a WordPress product company, and since 2020 he’s been working full time on his own projects.

One of his projects is a plugin called Simply Static. Its purpose is to make a static version of your website. This, of course, begs the question, what is a static site?

Back in the early days of the internet, before WordPress, if you wanted to put a website online, you had to write the HTML yourself. You opened up a text editor and started to type. When you’d finished, you had an HTML file which you uploaded to a server somewhere, and if someone wanted to view that page, the server would send over that file. It worked, but, thankfully, it didn’t stay that way for long.

Software for desktops were developed which would create the HTML for you. CMSs such as WordPress would take this further and create the HTML and CSS based upon the content you’d created and theme that was active.

This was extremely convenient, but when all is said and done, the output is still the same as it was years ago, HTML, CSS and possibly some JavaScript.

Depending upon your setup in WordPress, quite a lot of complicated operations are needed to generate that code. Caching aside, is there a case for saving your HTML files, uploading them to a server and then taking WordPress offline? Patrick certainly seems to think so.

We talk about how this flattening of your website takes place, and what the advantages might be in terms of speed and the cost of hosting.

We also get into the pros and cons of adopting the static site approach. Are there sites which are more suited to being static than others?

We also discuss what solutions are out there to make this happen, from Patrick’s own plugin to the hosting providers and SaaS solutions, which enable things like search and forms to still function.

It’s a really interesting subject and one that you might like to explore, and this podcast is a great primer for that.

Useful links.

Simply Static plugin on the WordPress repo

Simply Static Pro website

patrickposner.dev website

Netlify

GitHub Pages

LocalWP

Cloudflare Pages

Formspark

MailPoet

Bunny CDN

Contact Form 7

Gravity Forms

Elementor

Formidable Forms

Fuse.js

Algolia

Autoptimze

Leave a Reply

Your email address will not be published. Required fields are marked *

Leave a comment

Your email address will not be published. Required fields are marked *