Building Static Websites Using WordPress

Recently, in one of the Facebook groups I belong to, someone asked a question about how to make WordPress more secure.

Much as I love WordPress, I have to admit that for a risk adverse person it can be worrying to know that it is a target for hackers. People who build WordPress websites for clients are likely to recognise the scenario where they hand the site over to the client, stressing that it’s important to keep the theme and plugins up to date. A few months later the client asks them to do some more work, but when they log in to the WordPress dashboard they see several plugins that have not been updated. Hopefully the client, or their host, will have been keeping backups in case the worst happens.

There are ways to get WordPress plugins and themes to update automatically, and in fact this feature will be included in WordPress version 5.5 (due in August 2020). It’s possible to set up automatic backups too, but it would be nice not to have to worry about the more vulnerable aspects of WordPress.

Sometimes, I have used WordPress.com, rather than self-hosted WordPress, as this takes care of updates and security. However, it’s only with the relatively expensive Business plan that it is possible to use plugins or to install any theme you choose.

One of the other members of the Facebook group suggested that a possible solution would be to look into HardyPress.

A few days later, TechCrunch posted an article about Strattic titled “Strattic raises $6.5M to bring static WordPress to the masses“.

The premise behind these services, and others such as Shifter, is that WordPress is a great tool for building a website, but converting it to a static version results in a more secure, and faster loading, site. This approach wouldn’t be suitable for all websites as dynamic elements such as shopping carts, comments, social media feeds etc. would not work. But it seems to make sense for sites that don’t need that type of feature.

I was intrigued by this idea and found an informative article, “What is Static WordPress Hosting? Pros/Cons and How to Get Started” by WPLift. I decided to try out HardyPress and Shifter. Strattic is still at the Beta stage and appears to be aimed at bigger budget sites than the ones I tend to be involved with, but it could be a good choice for large websites with lots of traffic.

HardyPress Free Trial

HardyPress offers a free trial, with no credit card details required. Their cheapest package is a Personal Website for the equivalent of about £4.35 a month if paid monthly, or £3.50 if paid yearly (based on today’s currency conversion rates and not taking into account any taxes that may, or may not be applied). That is competitive compared with normal hosting costs and comparable to a WordPress.com Personal account which is currently £3 per month (annual payments only). There is quite a jump in price up to the HardyPress Professional plan which costs the equivalent of approx. £17.35 per month, if paid yearly. HardyPress say:

The “Personal website“ plan gives you all the essential hosting features you need to accommodate a “just getting started“ website or an existing small blog, personal, or business website. You will most probably outgrow this plan if you start attracting more than 10,000 unique visits per month on a regular basis or if your website needs more storage [than 500MB].

To put this in context, a WordPress.com Personal account includes 6GB. The janebwebsitehelp.co.uk website has 18 pages, 49 posts and just over 1,000 media items. When I back this up, I get a file size of nearly 416MB.

I visited www.hardypress.com and clicked the “Get Started Now” button. This took me to a form headed “Request Access” where I was disappointed to see that my gmail account was not allowed. I tried inputting it anyway just to see what happened (expecting it to be rejected) and got a message saying ” Request sent! We will get back to you shortly.” That was a bit disconcerting.

After a few minutes I got an email saying my account had been approved and giving me an activation link.

After setting my password, I was able to access my account and was taken to a screen suggesting that I imported an existing site using the All-in-One Migration plugin. There was also a link at the bottom of the screen for creating an empty new site, so I chose to do that.

It took a few minutes to install WordPress and publish the site, but the process went smoothly enough. It seemed that I had a new website with a slightly strange domain name. Pop-up tips appeared to lead me through my options.

I decided to use a custom domain name that I had previously registered elsewhere. I clicked on the Configure domain button which instructed me to configure my DNS records and told me what to enter under CNAME on my registrar’s site. I wasn’t sure whether I would be able to use a domain without the www prefix, but I didn’t spend a great deal of time investigating this. See https://www.hardypress.com/guides/add-an-existing-domain-to-your-hardypress-website/ for more information.

This change can take several hours (or even days) to resolve, but I could continue working on my website in the meantime.

I also clicked on the enable HTTPS button, which applied a free SSL certificate.

To start building my new site, I pressed the “Log into WordPress” button and a WordPress login screen appeared. My email address and my HardyPress password gave me access to a familiar looking WordPress dashboard.

One of the first things I usually do is change the permalinks setting to post name. That appeared to work O.K. as did adding a nickname to my profile, changing the site language to English UK, changing the date format and adding a tagline.

I was able to install my favourite theme, GeneratePress, just as I would for any normal WordPress website. When I visited the site from within the WordPress dashboard, GeneratePress was the theme being used, but the live version visible to the world was still using the default Twenty Twenty theme as I had not deployed the changes.

The next test was to see whether I could upload a premium plugin, GeneratePress Premium, and activate my GPP license. Again, that seemed to work flawlessly, including updating the plugin which required my license with GeneratePress to be activated.

GeneratePress has a useful feature whereby settings (colours, typography, spacing etc.) can be exported from one website and imported into another. I tried importing some settings I’d saved previously from another of my websites. Everything appeared to be applied successfully, including changing to a bright pink and orange colour scheme.

I hit the orange “Publish changes” button at the top of the screen, within the WordPress dashboard, and it changed to tell me that the site was being deployed. This took a few minutes, and then the live version of my website changed to the bright colour scheme etc.

When I went away for a while, WordPress was switched off after 15 minutes and I had to switch it back on, which involved a short wait, when I returned to HardyPress. That’s O.K. though – it should mean that my WordPress dashboard is not available to be found by hackers.

I was able to create new pages, import some test blog posts and upload photos without any problems. Everything seemed to work just as it would normally – including the using the customiser, adding additional CSS and setting up menus and widgets.

I checked that I could use GeneratePress Layout and Header Elements.

Code Snippets

One of the plugins I often install is Code Snippets. I was able to use this to add a snippet making the read more button on the blog page lead to the top of the corresponding blog post.

SEO and Backup Plugins

There didn’t seem to be any obvious problems when I installed and activated The SEO Framework plugin.

As for backups, these are included with HardyPress.

However, as with any other host, I would be more comfortable creating my own backups every now and then too. I installed the All-In-One Migration plugin to do this. I checked that I was able to export the site and import it to another WordPress installation on a normal shared hosting environment.

Blocks, Slideshow and Gallery Plugins

I installed the Kadence Blocks plugin so that I could try out some of the more interesting blocks, namely the accordion, tabs and icon list.

For the slideshow and gallery, I chose to use the Metaslider and GT3 Photo Gallery plugins.

I was able to see the plugins I’d installed listed on the HardyPress control panel, the next time I switched WordPress on. For a couple of them, this said that the compatiblity was “In review”, but at first everything seemed to work smoothly. However, I realised that the GT3 lightbox feature didn’t work. I decided to go with a standard WordPress gallery block instead and tried the FooBox lightbox plugin. That one seemed to be O.K. and was listed as compatible.

Search

The usual WordPress search will not work on HardyPress but they have come up with a solution that automatically replaces it in the WordPress search widget.

The only drawback I noticed was that, since everything on each page was scanned to find the search term, it was picked up when it appeared in sidebar widgets and post navigation, as well as in the content of posts. That should only be an issue if the word is part of a post, category or tag name.

Contact Forms

This is another area where HardyPress have had to do some work in the background to allow the use of the Contact Form 7 plugin, as WordPress forms would not usually work in a static environment. See https://www.hardypress.com/guides/contact-forms-on-hardypress/ I installed Contact Form 7 and found that the settings given in this guide had already been applied to the form. I used it to send a test message to myself.

The message arrived in my email inbox promptly and without any problems. As the documentation had stated, it said that it came from [Jane B’s Website]info@hardypress.com which was absolutely fine.

Note that the Personal Website plan allows only 100 emails per month to be sent using Contact Form 7.

Video Run Through

This video shows how quickly the pages in my test website loaded in real time. It demonstrates that I was able to display a slideshow, accordion, gallery etc. on the site.


Shifter Free Trial

To try out Shifter I went to www.getshifter.io where I saw that not only do they offer a 7 day free trial, they also have a Free Tier with 1GB storage and 500MB bandwidth. The Free Tier does not allow custom domain names. The first paid tier costs approximately £12.20 per month (based on today’s currency conversion rates and not taking into account any taxes that may, or may not be applied), or around £9.15 per month for an annual plan. Note that the Shifter plans are for 1 website; HardyPress allows unlimited websites for the Professional, and higher level, plans. You also need to take into account storage space and compare the other features.

I created an account and received a verification email within seconds. Once my account was verified I could create a new website.

I started WordPress…

…and clicked the Dashboard button.

This opened a new window with a normal looking WordPress dashboard, plus a few extra Shifter settings and links to Shifter documentation.

For this trial, I decided to install the All-In-One Migration plugin and use it to copy over the website I’d made previously with HardyPress. However, when I tried to import the file I got a message saying “There is not enough space available on the disk.” There was a button saying “I have enough disk space” though, so I clicked that in the hope it would work anyway. Luckily the site was imported in spite of the error message, but it was disconcerting.

It seemed that in order to deploy a live version of the website, I needed to generate an artifact.

This gave me a live version of the website, with the URL that Shifter had assigned. The various plugins I’d installed seemed to work fine to give me a slideshow, accordion and tabs blocks, and a lightbox for the gallery.

An SSL certificate had been automatically applied so that I had an https website address.

Search

I wasn’t surprised to see that the search function did not work. HardyPress have automatically configured their own version of search but Shifter do not claim to have done the same. However, their documentation suggested a few plugins I could use and recommended WP Serverless Search which I had to obtain from github, and then upload as a zipped file.

I followed the instructions from https://github.com/getshifter/wp-serverless-search and thought I’d got it working when I was logged into WordPress and viewing my site. Unfortunately, when I generated a new artifact (i.e. an updated version of my live website) the search did not seem to work on this public version of the site.

This was a shame, as on the version of WordPress in the background, I’d say that the Shifter search worked better than the HardyPress one, as it picked up the search term only when it appeared in the title or body of a post, not in the sidebar. I’m willing to believe that I had misunderstood the instructions and missed something obvious, but I’m afraid that I did not persevere with trying to get the search to work.

Contact Form

As with the search function, HardyPress have implemented a built in solution for contact forms, but Shifter have not done so. They do suggest some alternatives such as using Formspree.

Conclusions

After a shaky start, when I thought I would not be able to use my gmail address, I was impressed with HardyPress.

It felt more user friendly than Shifter somehow, but both interfaces were easy enough to use.

I like the fact that HardyPress have managed to integrate solutions for searching (even though it isn’t perfect) and contact forms (although the cheapest plan is quite limited).

Both HardyPress and Shifter allowed me to use my favourite WordPress theme. I could install plugins (including Code Snippets) and the customiser, menus and widgets worked as expected.

I feel that this approach would work well as an affordable, secure and fast loading solution for simple, brochure websites. For larger sites with more traffic, and a higher budget you would need to weigh up the advantages of a static site compared with managed hosting or a WordPress.com Business plan.

Of course, this idea would not be right for all websites, but I could definitely see myself suggesting it in certain situations.

Further Reading

Here’s a good article by codeinwp: “Does Serverless WordPress Make Sense? Shifter vs HardyPress – Top “Headless WordPress Hosting” Options Compared“.


More Tutorials

1 thought on “Building Static Websites Using WordPress”

Leave a comment