Creating a WordPress theme

This article is related with the theme development in WordPress. This article is intended for beginners in WordPress. In this article we will look onto the basics of theme development in WordPress.

Pre-requisites
– Basic Idea in core PHP
– Basic Idea of what WordPress Is
– Knowledge on Basic HTML
– WordPress Installed

How to Create a Basic WordPress theme ?

Creating a theme and integrating to WordPress is easy. If you think it is hard then obviously it will be hard. There is most to learn but lets keep the basics first without exploring onto the confusing ones. First create a folder and name that folder to something. Here we will call it basic_theme. Now copy that folder into your WordPress/wp-content/themes directory.

Before beginning you must first have the idea of what your theme would look like and must have thought and made up a wire-frame of your design. If you already have an html template thats outstanding.

web-layout

Lets say we have made three types of layout for our site. Now in order to achieve this we start from the common files.

Common files such as header.php and footer.php. These files will be used in almost all webpages. So, lets start by creating the following files inside your basic_theme folder.

  • header.php
  • index.php
  • footer.php
  • style.css
  • functions.php
  • sidebar.php

style.css

Paste the above code in your style.css file. The additional header information in the style.css provides details about the theme in the form of comments. The stylesheet must have the details on the theme in the form of comments at top. Same theme name cannot be assigned simultaneously to two themes as they will lead to problems.

header.php

Insert the following in your header.php file

Basically, this is simple html head code that starts the html tag and in the head section the meta information. The function here wp_head() will initialize all the necessary scripts and tags defined infunctions.php which we will be doing shortly.

The index.php file

In this file we will implement the basic content extracting codes

Posted on

 

In the above code we are using basic loop using while loop. The starting of the code begins with theget_header keyword.

The get_header will include the header.php file. It is a WordPress function that is built into WordPress core. Now that we know what this does the get_footer keyword does the same except it includes the footer.php file. But what does the following line do ?

This keyword checks whether there are any widget sidebar areas defined. If there is defined then that sidebar is shown. Widget is a WordPress functionality which allows the user to drag a component and add them to desired sidebar or footer content from backend.

Now, the loop part is just looping the post contents into structured html.

Sidebar.php

Paste the above code into your sidebar.php file. We are using the WordPress functions to display the categories and archives here. In order to generate dynamically see below code but dont use the below code yet.

The Footer.php File

Footer

Now, that we have completed all the theme files now we move onto the functional part i.e functions.php

The functions.php

In this file all the hooks, action, filters, css enqueue, js enqueues are done. The way you want to change the functionality of your theme will be mostly done from here and later on if a module is to be prepared and will contain alot of files then we will use plugins, which will help in extending the functionality to the site.

For more idea on basic themes see this: WordPress Codex

Copy and paste the above codes to your functions.php.

Basically, we are firstly setting up the theme adding nav menus. We added two nav menu using the function register_nav_menus and afterwards we en-queued our style.css from the basic_theme_scripts function.

You should now get a simple dynamic blog type homepage. There are numerous internal WordPress functions and better ways optimize and customize your theme the way you want. For the complete reference on theme development functions click here.

ABOUT THE AUTHOR

In a world without walls and fences, who needs windows and gates ? No gates, no windows bt apache inside! #dev Love for #Unix #Linux #Apple. Interests in coding, music, creative design, Linux and Apple products.

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *