
dougfoster.me – Website
Project Recap
Client
Date
June 2018, July 2023
Summary
2018 - WordPress website for sharing personal stories about life & work, photos, and work projects. Built with Beaver Builder theme & plugins, the site includes custom PHP & JAvascript code, All in One SEO, Clicky analytics, iThemes Security Pro, Slider revolution, and PODS for custom post types (CPT) & extended fields.
2023 - Revised and updated the design, added more content and content sections, also replaced several plugins (see Tools & Resources). Rebuilt the site navigation & menu. Reworded some earlier posts, improved SEO.
Project Details
Background
Hmm, ... well I guess you can learn more about me on LinkedIn or on the about page.
Problem
It was time to regroup and create a more up-to-date website for myself. I also wanted needed a site where I could describe some of the more significant interesting projects I've worked on over the years.
Solution
So ... Ta Da! ... I built a new website.
Tools & Resources
2018 - PhpStorm, Chrome Developer Tools, custom code (PHP/JS/jQuery/HTML5, CSS3), WordPress, Beaver Builder Theme, Beaver Themer, Beaver Builder Pro, Ultimate Addon for Beaver Builder, PDFjs Viewer, Pods, All in One SEO Pack Pro, BackupBuddy, Clicky Analytics, FooBox Lightbox, FooGallery, Gravity Forms, iThemes Security Pro, iThemes Sync, Relevanssi, ShiftNav - Responsive Mobile Menu, SliderRevolution.
2023 - Replaced PODS with the Advanced Custom Fields Pro and Advanced Custom Fields Extended Pro plugins. Integrated the Search and Filter Pro plugin (plus my custom code) to allow for detailed searching & filtering of content. Upgraded my custom Convinsys plugin.
Discussion
First thing was the domain name. I wondered what I should use, then it hit me. I have a BSME in Mechanical Engineering from Iowa State University - an "ME" degree as it's often called. "I wonder if dougfoster.me is available?" Bingo!! So I grabbed it & here we are.
Second, I hadn't updated my website since before Dad passed away (about 3 years ago) - and I sure hadn't posted any new content. So, it was time for a new site. I brought over the old stories but then promised myself I'd be more regular about posting new ones. However, before I start adding new Work & Life stories, I thought "You know, I need to pick out my best 'work' projects and do a short writeup on each one." So I added my best work projects (so far) to the new site.
Third, I'd been wanting to spend time with WordPress Custom Post Types and fields - and using the Pods plugin to create & manage them.
So instead of using a regular 'post' for my work projects, I created a 'Custom Post Type (CPT)' and added them that way. So far I love it - lots of amazing things you can do with custom post types. (2023 - I'm now using ACF Pro instead of Pods to manage custom post types.)
Ok, enough on the backstory. Here's some of the technical details about the site:
Since Beaver Builder leverages the Bootstrap framework, the site is fully responsive and looks good on devices ranging from desktop to mobile phones.
All pages, posts, and images are SEO enhanced by using the All in One SEO Pack Pro plugin. Besides basic SEO, content is optimized for posting to Social Media and indexing by major Internet search engines.
My previous website did not use https (see Why HTTPS Matters to understand why making the switch from http to https is becoming more important). Using Let's Encrypt certificates (Siteground makes these available with every account), the new site was implemented using Secure HTTP.
The site is also strongly secured using the iThemes Security Pro plugin. Two factor authentication ensures only authorized individuals are allowed to edit site content. Using this plugin along with an extensive security configuration will successfully thwart repeated hacking attempts.
Easy to understand, yet detailed traffic tracking is performed by Clicky.
Finally I created my own WordPress plugin for custom code I've added to the site. One thing the plugin does is to add JS, CSS, and PHP code on a per page basis. This makes it easier to maintain all the tweaks I've added - plus it should improve page speed. Code is loaded only when it's needed - either globally for the whole site or per page.
Below is a snapshot of the work projects page. I also added a custom taxonomy - 'skills' - for each work project. That's what the buttons you see in the snapshot below do - they filter out only those work projects with that particular skill (Explaining, Websites, etc.).