WordPress Theme Development
Nilambar SharmaWordPress DeveloperCo-founder WEN Themeshttp://wenthemes.comWordPress Theme Development2Bipin SinghWordPress DeveloperThemeGrillhttp://themegrill.com/
WordPress Theme Development Santosh KunwarWordPress DeveloperCo-founder eVision Themeshttp://evisionthemes.com
2
WordPress Theme Development3What is WordPress theme?Collections of files working togetherFocus on frontend display, graphical interface and designLicensing is always GPL in wordpress.org
3
WordPress Theme Development4Why WordPress theme?To create unique look for your siteEase for WordPress site owner. ( No need to have knowledge PHP, CSS, HTML )
4
WordPress Theme Development5Why create WordPress theme?WordPress is Free as in SpeechAllow users to change the look and functionality easilyWordPress is Flexible, Easy to Use and LearnContribution for WordPress Community
5
WordPress Theme Development6RequiredWordPress setupBasic knowledge of PHP, HTML, CSS and JavaScriptsGood text editor / IDELocal Server (eg, XAMPP, WAMP) & Browser (eg, Firefox)
6
WordPress Theme Development7RecommendedAccount in stackoverflowPassion to learnBookmark WordPress Codex and supportWall nearby to bang your head
7
WordPress Theme Development8Setting up a Development EnvironmentSetting up Local EnvironmentXAMPP / WAMP / LAMP /MAMPInstall WordPressEnable WP_DEBUG in wp-config.phpImport Theme Unit Test DataInstall Theme Check and Developer Plugin
8
WordPress Theme Development9Lets start CodingTheme lies in /wp-content/themes/Theme Development OptionsStarting from scratchTaking reference of already developed theme (Twenty Sixteen,Twenty Fifteen, etc)Using Starter theme ( eg : UnderscoreS - http://underscores.me/)
9
WordPress Theme Development10Theme FilesRequired filesstyle.css; index.phpFunctions file-functions.phpTemplate filesheader.php ; footer.php; archive.php; single.php; etc OtherHelper files
10
11
11
WordPress Theme Development12Template HierarchyWordPress determines which template file(s) to use on individual pagesFor eg:page.php : displays single pagesingle.php : displays single postsingular.php : fallback for page.php and single.php (since WP 4.3)Several other templates has different priorityRef: Template Hierarchy
12
WordPress Theme Development13Template TagsSpecial functionsWorksGet database valueGet themes filesExamplesget_header()get_footer()the_title() etc
13
WordPress Theme Development14The LoopPHP code used by WordPress to display posts.Use template tags to display content
14
WordPress Theme Development15style.cssThe main theme fileNot only CSSDetails about the Theme in the form of commentsTheme NameAuthorAuthor URIDescriptionVersionLicenseLicense URITagsText Domain
15
WordPress Theme Development16index.phpThe main templateLowest fallback in template hierarchyBasically displays blog listing using Loop
16
WordPress Theme Development17functions.phpLoaded automatically during WordPress initializationUse to add unique features to your WordPress theme.Theme features like, Navigations, Sidebars, Post FormatsLoad Text DomainOther features
17
WordPress Theme Development18Other filesheader.phpHeader section of your web pagewp_head() must be there just before closing tagDont link script and stylesfooter.phpFooter section of your web pagewp_footer() must be there just before closing tag
18
WordPress Theme Development19Other files (contd)single.phpDisplay single blog postpage.phpDisplay single pagesearch.phpDisplay search resultsarchive.phpDisplay blog posts under certain archive like category, tag, date, etc.
19
WordPress Theme Development20Other files (contd)comments.phpDisplay comments, comment form, etc404.phpError page ( if requested page is not found )sidebar.phpDisplay sidebarFunction `dynamic_sidebar` is used to displayed registered sidebar
20
WordPress Theme Development21Hooks: Action and FilterTriggers while WordPress runAction:Add functionalityFilter:Modify functionality
21
WordPress Theme Development22Keep In MindImplement WordPress template tags and hooks properlyPrefix your functions or classes with theme nameProper Input Sanitization and Output EscapingAlways use WordPress functions if availableSupport WordPress-generated CSS classes.Make your theme Translation Ready
22
WordPress Theme Development23Releasing WordPress Themes in WordPress.orgRequired Theme Filesstyle.cssindex.phpcomments.phpscreenshot.pngTheme Review GuidelinesShould be 100% GPLTesting
23
WordPress Theme Development24Other Helpful topicsPage templatesPost MetaConditional TagsCustom Post TypesWordPress DatabaseSettings API / Customizer APIAJAX in WordPress themeCustom Query
24
10/29/2015WordPress Theme Development25https://developer.wordpress.org/themes/getting-started/https://codex.wordpress.org/Theme_DevelopmentReference Links
25
10/29/2015WordPress Theme Development26
