Creating a WordPress Theme from Scratch: Structure of a Theme

Creating a WordPress Theme from Scratch: Structure of a Theme

If you have been following my post to setup the site from scratch you will just have three files in your theme directory:

Files in Theme Directory

 

This post is simply to tell you how WordPress processes things nicely technically so you can decide how best to use it for your design. Actually working out what your website is going to look like is a completely different task.

There are some built in files that WordPress expects that are immediately useful:

  • header.php
  • footer.php
  • functions.php

WordPress uses get_header() and get_footer() to grab the contents of these files.

functions.php is automatically included which is useful for setting up helper functions, creating menus for a theme or changing other variables within WordPress.

Similarly it is worth keeping in mind that the following pages can be used to define the outline for how the appropriate pages will look (however for an initial theme it probably isn’t worth editing these):

  • archive.php
  • category.php
  • tag.php
  • 404.php

Without any of these files, WordPress will simply look at your index.php and work out what to do from that.

So for now it is probably just inputting some values into the header and footer to get the structure of your site sorted.

index.php:

<?php
get_header();
get_footer();
?>

header.php:

HEADER

footer.php:

FOOTER

Going to the dashboard and now activating your new theme will simply show HEADERFOOTER on every page that is valid.

Cool. Now you can change those files to contain sensible contents (e.g. html, head and body tags!).

I also noticed that there were some issues with the default CSS – so remember to override anything you don’t like – e.g. body having a margin at the top!

Still to come: Adding Menus

Comments are closed.