This is the ‘Introductory’ post of my ‘WordPress Theme Design Tutorial For Hyper n00bs series‘. As I said before I am splitting this tutorial into many episodes to avoid confusions in your mind. Here I am going to show you each steps in creating a simple clean WordPress theme by your own. If you want a reference book (the dictionary for the WP) keep WP codex opened while you try the following lessons.
Basic Rules
1. Close all doors you have opened while progressing.
Many of the beginners leaves the page without closing all the tags which are opened, That will not give a result which you are looking for. Usually a tag is wrapped inside a < and > symbols and a / before the name indicates its closed, means <> is the opening tag and </> is the closing tag, for example<html> and </html>
The common place where you repeat this mistake is the usage of lists tag like:
2. Every WordPress theme must contain a style.css and index.php files
A WordPress theme consist of a css file, where you will define how the theme should look. and the Index.php file, where you will apply that css into a WordPress ready template file. Here is the complete list of files we are going to create for our test theme. Don’t get worried about them now we will learn to make them in coming classes.
- index.php
- single.php
- page.php
- header.php
- footer.php
- sidebar.php
- archive.php
- comments.php
- search.php
- style.css
- screenshot.png
Common Terms
Template: A set of codes that is reusable, without re-writing the codes again and again in many places.
Template File: A file that contains many templates, for example index.php, single.php etc..
Theme: The set of files like template files, images, and styles etc…
Post: Now you are reading a post from my blog. Simply its equal to the article in a magazine or a page from a diary.
Hierarchy
For the better experience, we order and organize every theme file in a specific manner. Can simply call it modular type or something similar.
In the above illustration we can see each green elements are included in the blue area. single.php, page.php, archive.php, search.php are some page templates which is very similar to the homepage template. but each of them has some specific usage and they will appear only when a request for them is made, like index.php will be used when ever a user loads the homepage of the blog, but search.php loads only when some search query is processed.
If some template files are missing in the theme, consider archive.php is missing, the WordPress will not put a ‘Archive template missing in the theme’ error screen, but the request will be redirected to the parent container index.php
There are many useful sides for this practice, we will learn them in up coming classes.
If you have any questions or doubts add them to the comments and check this page later for the reply, don’t email me them, you might not get a reply ! 
And stay tuned to the series for creating a WordPress theme by yourself !
Taking the course
Cool and informative graphics.
Hi Aravind, Happy to hear that you are following my TUT
Keep in touch
Nice TutoriaL
Looking forward for the next post in the series
I am following you too! Keep the bandwagon rolling!
Pingback: Episode 2, Structure: Template and Template files | FeatherPot