Think Different

In this tutorial, I will explain the basics of how WordPress theme works and show you how to convert a static HTML template into a theme. No PHP skill is required, but you need Photoshop and CSS skills to create your own design. 1. The Blog Frontend Before you start, let’s take a look at the WordPress default theme and see how it is structured. Take note of the elements (header, post title, search form, navigation, footer, etc.). Default Frontpage (index.php) Default Single (single.php) 2. Photoshop Mockups Based on the information gathered from the default theme, design a Photoshop mockup of your blog. Here I’m using GlossyBlue , one of my free WordPress themes , as an example. 3. HTML + CSS After the PSD design is done, create a static HTML+CSS template of each page. Why Create a Static HTML File First? Mainly because it will make the development process a lot easier. I usually create a HTML file for every template that I need, test it across all browsers, validate bo...