Create a custom WordPress theme: Step 1


There are many different WordPress themes available, but sometimes you just cannot find the one that will fit your needs. When that happens, it is time to create your very own custom theme. I will show you in a series of six steps how to do just that.

Step 1.

First of all, we should start off knowing how themes work. The theme works off of a series of template files. However, only two files are needed to get you going: style.css and index.php, both of which will be discussed in this series.

There are other template files used, too:

  • rtl.css
  • comments.php
  • front-page.php
  • home.php
  • single.php
  • single-<post-type>.php
  • page.php
  • category.php
  • tag.php
  • taxonomy.php
  • author.php
  • date.php
  • archive.php
  • search.php
  • attachment.php
  • image.php
  • 404.php

Before you begin, you should know what you want your theme foundation will look like. The foundation usually includes a header, main content, sidebar and footer.

In order to start creating, you need to use a text editor like Notepad, eMacs or TextMate. The first file I usually create is the index.html file, which would look something like this:

<html>

<head>

<title>Your Custom Theme</title>

</head>

<body>

<div id=”wrapper”>

<div id=”header”>

header

</div>

 

<div id=”content”>

 

<div id=”main”>

main

</div>

 

<div id=”sidebar”>

sidebar

</div>

</div>

 

<div id=”footer”>

footer

</div>

</div>

</body>

</html>

This should now be saved as index.html

As you can see, there are several div ids that will be connected later when we create the template files that will correspond to each.

So, this is the very first step in creating your own custom theme for WordPress. Stay tuned for step 2.


Posted on January 15, 2015 and filed under Custom Wordpress Themes.