Developing a WordPress theme from scratch

1
Developing a WordPress theme from scratch
Call (91) 99041 53672 Email
mail_at_kinsh.in Skype kinshtech
Website www.kinsh.in
2
Developing a WordPress theme from scratch
1

• 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.

3
Developing a WordPress theme from scratch
2

• 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.

4
Developing a WordPress theme from scratch
3

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

5
Developing a WordPress theme from scratch
4

• Rename your index.html file that you had created
  to index.php.
• Your theme is now created and it will show under
  Appearance -gt 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.

6
Developing a WordPress theme from scratch
5

• So your theme will comprise of
• index.php
• header.php
• footer.php
• sidebar.php
• functions.php

7
Developing a WordPress theme from scratch
6

• 1) header.php
• First 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
  
• lt?php get_header() ?gt
• Your css will be included in header file now with
  a dynamic path as below
• ltlink rel"stylesheet" href"lt?php
  bloginfo('stylesheet_url') ?gt" type"text/css"
  media"screen" /gt

8
Developing a WordPress theme from scratch
7

• 2) footer.php
• Like header you will have the footer file
  included as lt?php get_footer() ?gt 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

9
Developing a WordPress theme from scratch
8

• 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

10
Developing a WordPress theme from scratch
9

• 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

11
Developing a WordPress theme from scratch
10

• 5) index.php
• So your index file now only has references to all
  your files. You are simply calling all your files
  here.
• lt?php get_header() ?gt
• ltdiv class"row"gt
• ltdiv class"col-sm-8 blog-main"gt
• lt?php get_template_part( 'content',
  get_post_format() ) ?gt
• lt/divgt
• lt?php get_sidebar() ?gt
• lt/divgt lt!-- /.row --gt
• lt?php get_footer() ?gt

12
Developing a WordPress theme from scratch
11

• 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.

13
Visit kinsh.in for best web development services.
Call (91) 99041 53672 Email
mail_at_kinsh.in Skype kinshtech
Website www.kinsh.in