Zola from neglected WordPress

A friend's neglected WordPress website stopped working. I ripped the content and re-created it as a static site with Zola.


Zola from neglected WordPress

The cause

A friend and artist maintained his own website and the website for his partner. She is a great painter but not interested in maintaining a website. Some time ago he passed away.

The websites, without maintenance kept running until a couple of months ago. His website still running but her website crashed due to a failing Wordpress plugin.

Initial state

The challenge:

  • a vintage WordPress version,
  • outdated- and failing plugins and
  • no clue on the initial setup.

The way the website was configured, the technology used, the infrequent content updates and its intended audience, there is really no need to use WordPress.

Images of the artwork are the main content, three collections/galleries managed by a plugin, with different views and tags. All data stored in a database.

The paintings made are realistic paintings, it takes a lot of time to create these. Therefore the infrequent content updates.

Another thing is that the hoster is payed generously for WordPress-hosting but it's potential is barely used.

New approach

Instead of trying to figure out how everyhting was intended to run I decided to move it to Zola, a much simpler static site. Easier to maintain and opens the possibility for a cheaper hosting solution.

The database with meta-information on the images was replaced by a json-file. The json-file is read at build time and templates generate the different views in static pages.

The result

After creating the new static website I wanted to share the result in a visual appealing way with a "before" and "after" slider. It was not available in the theme, a good reason to create it ;-).

Home

After the crash I disabled the failing plugins, the website went back online without errors but it did not restore all pages.

I tried to figure out if there was an easy way to rebuild so I could re-create it in Zola but ended up looking at the Internet Archive. Therefore the empty page in the before/after.

Afterafter
Currentcurrent
Beforebefore

Recent werk

The section "recent work" was moved to a new page with a new horizontal timeline.

All her work in chronoligical order from the most recent- to the very earliest work.

Afterafter
Beforebefore

Te koop

The "Te koop", a for sale page shows work that is still for sale. It needs some attention from te artist because some of her work is already sold or no longer for sale. That is up to her.

Afterafter
Beforebefore

Kippen

"Kippen" or chicken one of her special subjects. The page shows all the chicken work.

In the background a component is used to select only the chicken-tagged images from the json file.

Afterafter
Beforebefore

Bloemen

"Bloemen" or flowers another one of her special subjects. The page shows all the flower work.

Same as the chicken page, in the background a component is used to select only the flower-tagged images from the json file.

Afterafter
Beforebefore

Themas

"Themas" renamed from other-themes. The page shows not only the previous themes but every originally used tag can be selected.

In the background it's another component that uses the json file to generate the tag-related selections.

Afterafter
Beforebefore

Informatie

The "Informatie" or information page provides information about the artist. Recent video from a local broadcast crew, an older interview from a fellow-artist, some publications and her CV.

The links from the old site "Expositites" and "Links" are added to this page. A table-of-contents was added for convenience.

Afterafter
Beforebefore

What next

Now that the design is ready it is time for the next steps.

Still some things to decide.

  • When to replace the still running WordPress with the new static design?
  • Reducing hosting costs
    • What services does the current hoster provide now? Like email, WordPress, SQL, sFTP.
    • At the same hoster?
    • Small VPS and self-host?
  • Future maintenance?
    • Keep doing it for her,
    • learn her how to do it or
    • build something to make it easier for her?

All along I'm happy with the current design and how everything is set up in the background. In time we will figure out the remaining questions.