Call : (+91) 99041 53672 | Email : mail@kinsh.in | Skype : kinshtech | Website : www.kinsh.in

Developing a WordPress theme from scratch

Developing a WordPress theme from scratch

To get started with your wordpress site, you first need to download and install wordpress. Setting up wordpress is pretty easy. Visit their official site to do this.

1

Developing a WordPress theme from scratch

Once you have completed your HTML, you can start integrating your HTML into wordpress.

Starting with the theme creation, firstly create your theme folder under wp-content/themes directory.

Create a new directory there of your theme name.

2

Developing a WordPress theme from scratch

There are 2 main files that you need to create initially - index.php and style.css

3

Developing a WordPress theme from scratch

Rename your index.html file that you had created to index.php.

Your theme is now created and it will show under Appearance -> Themes.

Go ahead and activate it. Technically your theme is ready. Now all you need to do is convert your static code into dynamic code and start dividing your page into various sections as per wordpress standards.

4

Developing a WordPress theme from scratch

So your theme will comprise of

index.php

header.php

footer.php

sidebar.php

functions.php

5

Developing a WordPress theme from scratch

1) header.phpFirst step towards making code dynamic is to start with moving all your header code to header.php and including it in your index file as

<?php get_header(); ?>

Your css will be included in header file now with a dynamic path as below:

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />

6

Developing a WordPress theme from scratch

2) footer.phpLike header you will have the footer file included as <?php get_footer(); ?> by moving footer code to footer.php

You need to create widgets using functions.php and include in your header/footer or wherever necessary. Here is the code example:

7

Developing a WordPress theme from scratch

3) sidebar.php

This is needed when you have a left or a right column in your website. Most of the websites have and if its a blog website, you will certainly want to have one.

Include all you sidebar code in this file and simply call this file in your index.php

8

Developing a WordPress theme from scratch

4) functions.php

All the widgets that you need in the site, need to be create in this file. See example below for the syntax:

9

Developing a WordPress theme from scratch

5) index.phpSo your index file now only has references to all your files. You are simply calling all your files here.

<?php get_header(); ?>

<div class="row">

<div class="col-sm-8 blog-main">

<?php get_template_part( 'content', get_post_format() ); ?>

</div>

<?php get_sidebar(); ?>

</div> <!-- /.row -->

<?php get_footer(); ?>

10

Developing a WordPress theme from scratch

Thats it! The theme is ready to fetch things dynamically exactly like a wordpress site should.

If you need professional help with your wordpress site, hire wordpress developer India that can provide you quality

services at affordable rates. For more information please visit www.kinsh.in.

11

Visit kinsh.in for best web development services.

Call : (+91) 99041 53672 | Email : mail@kinsh.in | Skype : kinshtech | Website : www.kinsh.in