This is a tutorial series covering the basics of developing a WordPress theme from scratch. It’s for you who have dabbled a bit in changing other themes, wishing you knew enough to create your own, or tried making your own theme from scratch, but had a hard time understanding the basics of what a theme needs.
Through 12 lessons this tutorial aims to guide you through developing your very own WordPress theme, while learning common practices and the basics on how WordPress works. The goal of this tutorial is not to finish with an amazing-looking and ready-to-use or sell theme, but to give you the solid foundation necessary to build and extend on it.
I recommend that you write out everything yourself instead of copy+pasting the code. That’s the best way to learn (don’t worry, we’re not talking about thousands of lines here)! The lessons are set up so that you learn what each bit of code does, step by step, so that you can modify and add to it along the way, so you can get it to be just like you want it to be or look like. At the end of each lesson I will link to documentation pages for each method used, usually to WordPress Codex.
This tutorial will not cover any styling (CSS), however it does explain how you can add your stylesheets to your theme and goes through how to tell WordPress to dynamically add useful classes in your HTML. I encourage you to style your theme for yourself as you follow along.
Prerequisites
This tutorial is for you who:
- Know the basics of HTML and CSS
- Know a bit PHP. You don’t need to be an expert, but should know the basics
- Are familiar with using WordPress
- Want to learn!
What you will need to follow this tutorial is:
- A local development setup. You can develop by transferring over FTP to a domain, but it’s recommended to set one up locally. You would (obviously) also need to have WordPress installed in your development site. I explain shortly how to do this in Part 0.
- A good text editor. You can use any editor, such as Notepad and the like, but it’s recommended to use a software targeted for coding (it’s easier to read, find and write code). Personally I use Sublime Text 3.
Tutorial Table of Contents
Below there are direct links to all 12 lessons in this tutorial; however at the end of each lesson you’ll find nagivation links to the next or previous lesson, so you don’t need to come back here.
Without further ado, let’s begin! If you already have a local WordPress development setup, skip right ahead to Part 1: Introduction.