How to customize your own WordPress Theme

Once you could write HTML and CSS website template, then you will be able to customize it to

WordPress Theme.

For to do that, there is some basic thing you need know:

1)Need understand WordPress Template Hierarchy, if you don’t knwo before, don’t scare.
Here is few template you must have in your theme folder.

Index.php //  main Theme templateindex.php
page.php //this is the static page template in wordpress
single.php //this is post page template
home.php // blog template
front-page.php//shown On front
archive.php// for archive page template
search.php// if you don’t have wordpree will use index.php

For more detail could go to http://codex.wordpress.org/Template_Hierarchy

2) WordPress cut page into pieces, so onece you have the html and css page, then slide it into
header.php, footer.php, sidebar.php(if you design have sidebar)

3)Here is the basic function you need it.
The path of style.css is: <?php bloginfo( ‘stylesheet_url’ ); ?>
The path of the theme folder: <?php bloginfo(‘template_directory’); ?>
<?php get_header();?> //this is for you get your header
<?php get_footer();?> // this is for you get your footer
<?php get_sidebar();?> //this is for you get your sidebar, if you have sidebar in your design

<?php if(have_posts()):while(have_posts()):the_post();?>
<?php endwhile; else:?>//this loop is very important,will be use for a lot of times when you

create a wordpress theme

In next post I will use a bootstrap Jumbotron template,here is the link http://getbootstrap.com/examples/jumbotron/  I will  customize it into wordpress theme

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s