The big clean-up

This year too, I had planned some weeks off during the summer to give myself and family some rest. And what will you do then? Right! Clean up your own website, because that was 2 years ago. Over the past 2 years, I have learnt a lot, when it comes to content, but also technology, and I wanted to implement all that into the website. In this blog, I'll show you what has changed (under the bonnet).

Was the old website no longer good then?

The website that was there was definitely good. Of course, like the other websites with a maintenance contract, the website was neatly maintained and had the latest version of Joomla and all its extensions. It was found well in Google. Conversion was fine, I hardly had to be bored and sometimes even ran out of time. And all thanks to word-of-mouth advertising and my own website.

I had written down for myself 2 guiding principles for the new website.

1. Optimisation

A new website does not have to mean a big change for the visitor. And under the motto "Never change a winning team", I certainly didn't want to change the structure of the entire site.

Improving the texts

Last year, I followed Aartjan van Erkel 's training course "Online Sales Success XL" and learned a lot from it. I had already largely implemented the tips he gave me regarding content in the website and since that had a positive effect, I wanted to adopt the content as much as possible in the 2017 version of my website.

Of course, it was possible to copy all the texts (via the database) to a new environment, or to take the old site as a base, but I opted to do a complete new installation and transfer the texts 1 by 1. This way, I could force myself to go over the texts again, updating the text here and there or ironing out minor errors. The texts were previously formatted in UI-Kit and I built my new template in Bootstrap3, so the CSS classes have to be adjusted anyway.

For the fonts, I no longer wanted to depend on fonts.google.com, so I downloaded the fonts and they are now loaded locally.

A new template

In recent years, I was quite a fan of Yootheme templates and in 9 out of 10 cases I used the Yootheme Master template, which I could completely customise. Nowadays, Yootheme has switched to Yootheme PRO and some people wax lyrical about it, but I can't work with it. I can't get used to the whole idea of pagebuilders. So I started looking for an alternative and soon found out there was none. Many existing templates have huge features that I don't want to use or have module positions that I want different.

So there was nothing else to do but build my own template. With the module positions as I was used to with Yootheme and without all the unnecessary crap. In my search for my own ideal template, I used various examples from JoomlaCommunity (via github) and presentations such as at JUG Utrecht, among others.

Because of Bootstrap 3, the template also uses LESS, which in turn makes the development of the site faster, and can be compiled and minified via the template itself.

FontAwesome which I use for my icons, will soon come out with a new version FontAwesome5 and I have access to the PRO version. Within my template, I will therefore make use of that.

Improving speed

When I looked at the website in Google Pagespeed, I saw a number of recommendations to improve speed. To achieve this, I had to let go of some extensions I was using and solve this via Joomla itself. And the results are there.

At the top, you can see the old results. Below that, the new scores.

Important, of course, are the scores for Pagespeed and Yslow. I couldn't get the score at Yslow to 100% because I like to use Google Analytics and that causes a small decrease in the score, but I take that for granted.

By optimising the whole thing, you can see that the page load time and the number of requests in particular have decreased considerably.

2. Back to the core

Recently, many improvements have been made to Joomla, which in some cases makes the use of extensions unnecessary.

Widgetkit → Joomla alternative layout

The "header" was built in Widgetkit and now it is a module position with a background image. The "collaboration" module was a slider in Widgetkit and is now a number of separate images in 1 module. For the "latest blogs" module, I now use an alternative layout of mod_articles_category, whereas previously I would solve that in Widgetkit as well. For the visitor no difference, for the website speed quite an improvement.

Easyblog → Joomla blog view

Easyblog did its service as a blog system. Lately, I found adding or modifying posts very laborious and this is now solved by using Joomla's default content component. In doing so, I make use of overrides, as at the bottom of this post you will find social media buttons for sharing the page.

You will also see a block at the bottom of the page with information about the author. This has been solved by using Custom Fields in user management, a new feature in Joomla since version 3.7.

JCE Editor PRO → TinyMCE Editor

The updates to TinyMCE editor (Joomla's default editor) make it unnecessary to still use the JCE Editor.

So what extensions do I still use on this website?

Completely without extensions is (almost) impossible. So below is a list of the extensions used on this website.

AcyMailing: For sending the free giveaway and newsletters.

Admin Tools: For a bit of protection.

Akeeba Backup: For the necessary backups.

Advanced Module Manager: To make my modules appear on the right page.

Cache Cleaner: To clean up the cache memory.

Conditional Content: To hide my phone number when I don't want to be called :)

JCH Optimize: For optimising the pages.

OSMAP: The sitemap.

RSComments: For posting comments under blog posts.

RSForms PRO: The contact form.

SocialMetaTags: For sharing articles on Social Media.