WordPress Updates and New Look!

I spent a few days of this COVID-19 crisis sitting in front of the computer and rebuilding a lot of this blog’s WordPress front end. The prior theme was nice looking but I was starting to find issues with its speed. Ultimately, it was just easier to gut and redo it than fix. I also regenerated all of the images with ShortPixel Image Optimizer to further speed up the delivery on mobile devices. Another change is I need “set and forget” solutions. Over the years I’ve deployed a number of backend plugins, and because I am a computer geek, I usually chose ones that were extremely powerful. The downside is that they also needed a lot of care and feeding. I simply don’t have the time anymore, so giving up some flexibility for automation.

For the WordPress theme, I purchased Fluida-Plus from Cryout Creations. I quite liked the layout and the insane number of options available to customize the theme. There are a number of options that will be put to use once I build out a WooCommerce backend to the website. This will allow me to sell prints directly, at better price points for certain image sizes. I will continue to use SmugMug for those I can’t do myself, and where feasible integrate them into the WooCommerce platform on WordPress.

WordPress Front-end / Theme

One of the things I like about Fluida is that its fully responsive. The previous theme I was using was mostly responsive, but some areas like images for example were not optimized for mobile devices. Fluida has WordPress serve images for the proper screensize as it creates more than a few thumbnails of each image. Yes this takes up some extra disk space, but storage is cheap – serving right sized images to mobile devices more than makes up for the extra cost.

The home / landing page has over 200 options multiple areas, icon boxes, post boxes, sliders, featured posts, and the entire kitchen sink. Each of these are fully customizable and with the plus version you can arrange them anyway you like on the page. For the moment, I have mostly replicated the old theme’s look for the landing page but I’ll be redoing it further once I get a handle on the tools available.

Another improvement, the theme is much lighter script wise. Even running apache with HTTP/2 enabled, each round trip to the server for yet another script causes more delays for page interaction. The prior incarnation of this site took about 3 seconds for interaction, and up to 6 seconds for full page load. Now I am getting interaction in 1.2 seconds and full load-out in about 3 seconds. This is a huge improvement for mobile users on their phones or tablets. The desktop version improved as well, but as the prior was much faster on desktop devices, the improvement was lesser.

There are still a few things I need to work on. I am not happy with the font selections, nor the ability to add font-display:swap in the code that loads the web fonts easily, but the issues are minor and the ease of managing WordPress’ look and feel through this template are amazing!

I did run into one “issue” or unintended consequence while switching themes. After switching a WordPress theme, you usually need to regenerate all your thumbnails. Doing this caused ShortPixel Image Optimizer to run through the API credit I had, so I dropped another $10 USD for 10k more optimizations…

WordPress Back-end / Plugins

Keep it Simple Stupid - especially in WordPress sites!
Keep it Simple Stupid … or at least relatively simple

I am not going to go through all of these plugins. Most are fairly well known, but I do want to touch on a few and walk through why I use them. For the sake of simplification and “set and forget” plugins, I’ve settled on the following:

Ad InserterPhotonic Gallery & Lightbox
AddToAny Share ButtonsRelevanssi WordPress Search
Custom Facebook Feed ProShortPixel Image Optimizer
Envira GalleryUpdraftPlus Backup
ExifographyWordfence Security
Instagram Feed ProWP-Rocket
Monster Insights *Yoast SEO Premium

Ad Inserter is an amazingly powerful advertising and affiliate link management solution. I use it to insert amazon affiliate scripts on pages, as well as other advertising network scripts. You can configure where each ad appears, by page section, paragraph numbers, or nearly any other HTML functionality. If you want to change ad scripts, you do it in a single place and roll it out. I have used it on this and other sites for a few years, and I still haven’t found a configuration and placement I couldn’t make happen once and repeat often

Custom Facebook Feed and Instagram Feed (pro versions) are both from SmashBallon, and elegantly do very specific, simplistic functions. These are so “set and forget” I have completely forgotten they were even running – until either Facebook or Instagram changed an API that forced a plugin update. Each has a number of ways to grab from your associated feeds or pages to integrate into WordPress. You can see the Instagram Feed plugin in the footer of every page on this site, click any of the Instagram images and see the functionality I’ve used… very cool indeed!

WP-Rocket. Ok, this is a new one for me. I used another WordPress cache and optimization tool in the past, and it was great. Unfortunately, it also took way too much time to manage, care and feed. While WP-Rocket may not have all the customization options, it excels in ease of use, stability and fits well into my “set and forget” paradigm. It is a premium WordPress plugin, but the $49 USD was more than worth the time I am saving. There are more than enough tweaks you can make to improve any blog in the tool. I have had improved rankings in GTMetrix and Google PageSpeed so its all I need. You can see in the screenshot below the GTMetrix score of the home page after the first pass of optimizations.

GTMetrix Report after optimization for the landing page of this website
GTMetrix Report showing the improvements post optimization

For a photography based blog, Envira Gallery, Exifography and ShortPixel are must haves. I’ve switched the gallery to Envira some time ago, still have a bunch of work to reorganize and get all the backend redirects configured. It may be a lot of work, but damn the gallery is gorgeous and fast. Exifography keeps track of all the EXIF data of my uploaded photos. Using a simple WordPress shortcode inserts all that data into posts where I need them. EXIF data is the metadata about an image, camera, lens, focal length, ISO, etc. ShortPixel simply optimizes the hell out of the images, making them smaller for web delivery without losing image quality. It also creates copies of each JPG or PNG image in the new WEBP format, further improving optimization for browsers that support this image format.

Updated: Monster Insights was removed shortly after this post. It was nothing to do with the plugin per-se, but rather it was overkill for my needs. If you need all the bells and whistles it provides then it is a great tool. For my needs, it was a bit overkill for inserting the Google Analytics code. Instead I just inserted it into my theme’s header.php file and moved on.

The End?

Not even close! I am going to be working on this migration for a few weeks, updating and tuning as time allows. My day job also has me working all sorts of long and odd hours. Add to that the weather getting nicer I want to get out exploring with my camera gear more. Not to mention, here in the northern hemisphere, the Milky Way is coming into prime time for astrophotography. Priorities right?!?

If you have any questions about any of these changes, the WordPress plugins I use (or stopped using), or the theme leave a comment below or drop me a line. I’ll respond as soon as possible between working and playing taking more photos!