In a recent client project, where I also created the skewed testimonials carousel, I created a contact form using Gravity Forms. This form allows potential…
Create a Unique Testimonial Carousel
I recently finished up a project for a friend who’s a personal trainer. I had complete control over the design and development of the website,…
Host Your Website for Free with Kinsta: A Comprehensive Step-by-Step Guide
A few weeks ago, Kinsta, a major player in the cloud hosting industry, announced that they are now offering free static site hosting. This is…
How to Display Dynamic Content With the Litespeed Cache Plugin
Would You Like to Display Dynamic Content (via a shortcode) In Your Cached WordPress Website? Read on if You Are Using the Lightspeed Server.
Creating a Pomodoro Timer From Scratch With HTML, CSS & JavaScript
I’m a Big Fan of the Pomodoro Technique and in This Week’s Tutorial, We Will Be Creating a Pomodoro Timer, With HTML, CSS, & JavaScript.
How I FTP Commits to My Host via Github
How I’ve changed my workflow from FTP’ing directly, to using Git, Github, and Github actions to FTP on Commit.
Build a Creative Animated Hero Header
Here’s a tutorial on how to grab your user’s attention by building an animated hero header that animates the background, and content Into view, upon page load.
The Ultimate Guide on How to Build a Custom Google Map
In this tutorial, we go through the steps of creating a stylish custom Google map with bespoke icons and colour scheme, using the Google Maps API.
Create a Gutenberg Block with Advanced Custom Fields
This tutorial requires the Pro version of Advanced Custom Fields. If you know me I tend to bang on about my love for Advanced Custom…
Create an A-Z Filter For WordPress Posts
You’ve most likely seen these A-Z filter areas on your travels. They’re pretty useful if have a site that contains a lot of index type…
Exclude Specific Posts From WordPress Website
When you create your hide_from_loop custom field, You will have to re-save your posts to update the custom field value in the database for this…
Create a Blurred Paywall Area
You’ve most likely seen one of these paywall sections on your travels to some media websites that give you a few free articles to read,…
WooCommerce Template Overrides Not Working
This is a quick one that I recently spent a few minutes scratching my head over. I am working on a WooCommerce store and copied…
How To Create Your Own Strava Stats Widget
Strava is one of the world’s most loved social networks for tracking all things fitness. You can track your runs, rides, swims and many other…
Change Email Recipient Based On Subject in Contact Form 7
I have been using Contact Form 7 on a lot of my personal sites, as well as client sites for over a decade now and…
Create multicolored borders with CSS
A nice easy one today. We are going to create a little non standard border that includes a few different colors to spruce things up….
Detect if User Is Using Dark Mode
As I use dark mode on all of my devices, all of the time, I wanted to find out how easily I can detect if…
Create a Slick Rollover Effect For Text Links
I stumbled upon this neat little text effect browsing – nay drooling over the Blue Stag website on my internet travels. It’s subtle, adds to…
Mask text with an image in CSS
Sometimes default text just won’t cut it. If you are designing a site or landing page that needs high impact imagery inside of your text…
Adding an Animated SVG Border To Links
I tried something a bit different today and outside of my comfort zone and experimented with animating SVGs. The idea I had was to animate…
Adding Dropdown Arrow Indicators With Font Awesome
I am using the 4.7 version for this tutorial, not the latest 5.0+ version as it works fine for my needs. If you want to…