Create custom wordpress theme is not a difficult task when compared to other CMS/framework websites. A WordPress Theme is a group of files that work together to generate a graphical interface with an unifying design for a website. These files are named template files. A site execution depend on how the theme works. You can create custom wordpress theme without any complications.
You might be also interested in how to create a wordpress plugin
Step 1 – style.css to create custom wordpress theme
The style sheet is the important file of the theme for WordPress. There are a few things you need to do. The first is renaming the main file to style.css, next you have to add a bit of commenting to the file.
/*
Theme Name: themename
Theme URI: www.thecompletetech.com
Description: A theme built for beginners
Author: Vivek Jayakrishnan
Author URI: www.thecompletetech.com
Version: 1.0
.
General comments/License Statement if any.
.
*/
The code above is all included in a comment, so it won’t affect the style definitions. Fill it our with few more details so WordPress can show more details to the website admin. Make sure you add it at the top of the file with no spaces before it.
We renamed the style sheet file from the template to 1.css. We have also made a new folder called typography-paramount which will be what we upload to the WordPress theme folder. Put the style sheet in this folder, but not under another directory otherwise it cannot be seen by WordPress.
Step 2 – The Header and Footer
In this step, we’re going to design the two files: header.php and footer.php.
header.php
Create a new file in the theme folder called header.php and open up index.html from the template. Copy the below code snippet.
On completion this will become the header. This will be there on every page of the site.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>-</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/1.css" type="text/css" media="screen,projection" />
</head>
<body>
<div id="wrapper">
<div id="header">
<p class="description">
A theme built for beginners
</p>
<h1><a href="#">Themename</a></h1>
<ul id="nav">
<li><a href="#">Link Here</a></li>
<li><a href="#" class="active">Link Here</a></li>
<li><a href="#">Link Here</a></li>
<li><a href="#">Link Here</a></li>
<li><a href="#">Link Here</a></li>
</ul>
</div>
We will now add the WordPress template tags to header.php. This template tags are predefine funtions. It tells the WordPress where to include the different content into the theme. Also remember to modify that link to the stylesheet.
