By creating simple WordPress theme, we can easily understand the WordPress mechanism. In this post, we develop a WordPress theme from scratch. Here I just give you code that you have to add in theme templates. By doing so you get the basic idea about the working system of a WordPress theme.

Points to remember while creating simple WordPress theme:

  • Install WordPress on your system. WordPress should be worked properly. For installing WordPress you can follow this post.
  • Read the template hierarchy adopt by WordPress at this post.
  • Place theme folder in localhost/project-name/wp-content/themes directory.
  • Theme name and theme root folder name should be same. Like if your theme name is First Theme then theme folder name should be first-theme.

So let get the start.

Creating style.css and give name to your  first WordPress theme

We tell before, the style.css file is must in a WordPress theme. As it contains the theme information part. For details please follow our post. It basically contains a comment part that tells WordPress that a theme exists here.

Open notepad and copy this code. Save the file as style.css. You can add your name and fill some creative.

Now in WordPress dashboard, go to appearance/theme. Here you can’t get your theme name. As till now, you do not add index.php file.

Adding index.php

Now copy below code into notepad and save it as index.php in your theme.

Now again refresh theme page. You find your theme name here. You can activate it.

When you read the code, you find some name like get_header, get_footer and get_sidebar. These are prefined functions to call a particular type of file. You will get them soon.

 header.php: a file for get_header

Now copy below code into notepad and save it as header.php in your theme.

footer.php: a file for get_footer

Now copy below code into notepad and save it as footer.php in your theme.

sidebar.php: a file for get_sidebar

Copy below code into notepad and save it as sidebar.php in your theme.

A sidebar is an area for widgets. A widget generally shows dynamic data related to posts, comments etc.

single.php: a file for single post

Copy below code into notepad and save it as single.php in your theme.

page.php: a file for page

Copy below code into notepad and save it as page.php in your theme.

functions.php: a file to extend functionality of theme

Copy below code into notepad and save it as functions.php in your theme.

comments.php: a file to show comments

Copy below code into notepad and save it as comments.php in your theme.

That’s all for creating a simple WordPress theme. Hope this tutorial clear many things. It’s just an introduction to theme development. Next steps will be published shortly.

Did you enjoy this article?
Signup today and receive free updates straight in your inbox. We will never share or sell your email address.
We hate spam. Your email address will not be sold or shared with anyone else.