WordPress Theme Development
7 likes3,085 views
The document discusses WordPress theme development. It defines what a WordPress theme is and explains that themes are made up of files like HTML, PHP, CSS and images that style a site without changing the core WordPress software. It outlines three methods for developing themes: from scratch, customizing existing themes, and building a child theme. Key files needed for basic theme development are also listed like style.css, index.php, header.php and footer.php. The document provides an overview of the template hierarchy in WordPress and explains how to create custom page templates and define a theme's description in the style.css file.
WordPress Theme Development
- 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
- 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