Wordpress theme developement

About this website

To support students on the Applied Art for the Web ↗ Module.
And for all web students interested in WordPress and theme building.


This website is essentially one single tutorial, split into five parts, and including a few extras. It does NOT offer specific insights into the theme code or functions, there are brilliant sites out there you should explore for such detail. It is a mirror of the workshop session, a practical walk-through the design, vanilla theme and the transfer from prototype to theme.

Design/build: WordPress themes

This site is intended as the very first step in your journey from designing static webpages to the transition to implementing your design as WordPress theme. It features a very simple and clean design which you are most welcome to use for your very first theme build, before venturing further.

The tutorial includes step-by-step instructions of how to implement an existing design—in hand as prototype (HTML/CSS/JS)—as WordPress theme (PHP/CSS/JS).

Dive deeper

While this little site will hopefully give you a hand getting started, you’ll only get to grips with WordPress themes by delving into the template code and learning more about the famous loop and functions. To start with, check out the excellent wphierarchy.com ↗ and use it to access the Codex ↗ for code snippets, references and instructions of use – or read up on specifics in the Code Reference ↗ directly.

My advice would be to start with little steps, don’t let the theme’s complexities freak you out :D Look up snippets you’re using initially, and experiment with their use. Don’t worry about the sheer amount of new code and functions, start with what you need for your design/theme and slowly learn more. Allow yourself time to play, break things, fix things and learn :)

Tutorial links