Making a new WordPress theme from scratch can seem daunting, but it’s pretty easy if you know the steps. This series will explore the techniques you need to employ to build a WordPress theme from scratch. In the series we will be covering:
So, you want to make a WordPress theme, from scratch. There are a few questions you have to ask yourself at this stage.
Answering question 1)
Why Do I want to make a WordPress theme?
Answering question 2)
What themes out there come close to what I want to do
Answering question 3)
What can I do thats better or different from the themes that are available
At this point you have a solid starting point, you have done some research, asked yourself some questions, gotten some answers and can start digging into the making of the theme.
Having the questions and answers at this stage will help you create a specification that will achieve your goals. This will help when you come to the implementation / testing stages – as you will have some conditions to test against!
Fortunately WordPress is really well documented. We have a starting point laid out for us while we create our information architecture for our WordPress theme – the WordPress template hierarchy tells us every file we need to create for every scenario.
Starting from the right we can make the following files:
We can then look at primary templates (you only really need to create these when making a new WordPress theme from scratch):
Secondary templates (if not present, the corresponding primary template will be used)
These are great if you want a different layout or components eg in your author pages from your tag pages
Attachment Mime types: WordPress also supports mime type templates:
WordPress recommend following the twentyseventeen file hierarchy.
If we add those recommendations to our template hierarchy from the previous section,
we end up with:
– css (dir)
– images (dir)
– js (dir)
– footer (dir)
– header (dir)
– navigation (dir)
– page (dir)
– post (dir)
Information Architecture is the cornerstone of any website (or digital project in general).
At this stage we know every file that we will make, and their relationship to the content inside a WordPress site. This is a very good starting point for our Information Architecture.
In your own blog you would also include the content in the Information architecture, but we can skip that as we are making templates for others to use.
What we do have to do though, is to make a list of each of the components we are looking to add to each of these pages. I like to do this part on paper (you can go back and make changes multiple times) and as part of a team (everyone has ideas to contribute) – but you can do it solo if needed)
I quickly came up with this as a starting point:
featured posts slider
featured posts from each category?
featured posts from the top categories?
number of posts
hamburger menu icon
At this stage, I have enough to start making wireframes! I also have enough to start looking into the features that WordPress has available for each of the sub-sections and the functions available to me.