How to create a WordPress theme from scratch — A Definitive Guide

Note: This post hasn’t been updated for a while

Creating a WordPress theme is a very exciting project, especially when you are curious about how WordPress deals with themes. The current theme used on this site is the TwentySixteen theme from WordPress. I will be changing this theme to a custom based theme I have designed for my site. If you want to build a WordPress theme from scratch, you have come to the right place. In this tutorial series, I will show you how can build your own WordPress themes and understand how WordPress itself works on the presentation layer.

I will be using a CSS framework Bootstrap in my project. A CSS framework takes a great deal of load off the developer and you can literally save hundreds of hours by reusing the same components on different clients.
As the title mentions, we will be starting from base files index.php and style.css, because we need to understand some basic WordPress concepts before incorporating Bootstrap.

Here I have created a quick mockup on how my site will look after completion. The calculations are not precise.  There maybe small changes in the actual website but overall it will be the same.

The WordPress theme design

Learn to code WordPress theme from scratch
Homepage design

We have a standard WordPress blog with content on the left and sidebar on the right. But there are some neat tricks I will show you that will enhance user experience.The series will be broken into several parts. Each part will be explained along with the code.

This tutorial is intended for developers with basic knowledge of PHP, HTML5 and CSS. We won’t be using too much Javascript here, but I will show you some of its basics. Bootstrap incorporates responsive design as well.

Theme development requirements

So lets build a WordPress theme from scratch.

Next tutorial : Setting up of Local WordPress development environment.

Leave a Comment

Your email address will not be published. Required fields are marked *