WordPress theme development from scratch, customize existing themes, make child theme.

1. WordPressTheme
Development
-Bijaya Kumar Oli
bj.aspire@gmail.com

2. What is WordPress Theme?
 Collection of files that work
together to produce a graphical
interface.
 Functionality of website
without changing the basic
WordPress software.

3. Theme Makes from
 HTML
 PHP
 CSS
 IMAGES

4. Some examples
of
WordPress Themes

8. Way of develop themes
1)From Scratch
2) Customizing themes
3) Build Child Theme

9. Minimum files require
 style.css
 index.php
1) From Scratch

10. Basic Layout of website
1)From Scratch

11. Basic files for theme development
 header.php (displays headers and navigation, contains HTML code)
 index.php (home )
 footer.php (Contains instructions for global footer , closes HTML tags.)
 page.php (individual pages)
 single.php (individual posts)
 sidebar.php (displays sidebars, which can be set up in functions.php)
 functions.php
 style.css
1)From Scratch

12. Define Theme Description
D
Define theme description on
style.css
/*
Theme Name: Wordpress Sanothimi
URI: http://wordpress.org/
Description: Clean Responsive thene.
Author: Bijaya Oli
Author URI: facebook.com/bijaya.oli
Version: 1.0
Tags: black, blue, white, two-columns,
License: License
URI: General comments (optional).
*/
1)From Scratch

13. Make Functional
functions.php is the main function file
 Contains custom functionality for theme
 Can be procedural or Object Oriented
 Can include plugin-like code
- Create settings page in admin area
- Apply filters
- Perform actions etc
1)From Scratch

14. Basic functions defined by WordPress
Posts
the_title (outputs the title of the post)
the_excerpt (outputs the post excerpt)
the_content (outputs the full post content)
the_category (outputs the post categories)
the_author (outputs the post author)
the_date (outputs the post date)
the_post_thumbnail(outputs the post image);
the_tags (outputs the post tags)
See more on
http://codex.wordpress.org/Function_Reference/
1)From Scratch

15. Custom Page Templates
Method of define custom template
<?php
/*
Template Name: Product Page
*/
?>
1)From Scratch

16. Template Hierarchy
Category display
Template file used to render a Category Archive Index page
1) category-{slug}.php
2) category-{id}.php
3) category.php
4) archive.php
5) index.php
See more on
http://codex.wordpress.org/Template_Hierarchy
1)From Scratch

17. Customizing Themes
 Customize existing themes
 Customize style, layout, functions etc.
 Add page templates
 Add custom post type, widgets

18. Starter Themes
Develop theme using starter themes.
(popular starter theme)
1) Underscores
http://underscores.me/
2) Bones
http://themble.com/bones/

19. Example of Starter theme (underscore)

20. Example of Starter theme (bones)

21. How to create child theme?
1. Creating Your Child Theme’s Folder
2. Creating Your Child Theme’s style.css File
3. Activating Your Child Theme
4. Making Further Alterations and Additions

22. style.css example of Child Theme
/*Theme Name: twentytwelve_chile
URI: http://twnty.tl
Description: Example child theme of twenty thirteen.
Author: Bijaya
Version: 1.0License:
GNU General Public License v2.0License
Template: twentytwelve
*/
@import url(../twentytwelve/style.css);

23. Screen shot
of child theme
At backend

25. How child theme works?

26. Questions?

27. Thank You
Contact me :
bj.aspire@gmail.com
facebook.com/bijaya.oli