1. HOW TO MAKE WORDPRESS
THEMES FASTER, SMARTER &
WITHOUT SWEARING
MARCIN WOLAK

2. START

3. CLIENT

4. GRAPHIC

5. HTML CODER

6. WP DEVELOPER

7. GRAPHIC
+
CODER
+
WP DEVELOPER

8. GRAPHIC
Δ
CODER
Δ
WP DEVELOPER

9. WP START

10. HOW MANY FILES
YOU NEED?

11. THE SIMPLEST THEME
INCLUDES ONLY
A STYLE.CSS FILE,
PLUS IMAGES, IF ANY.
(WORDPRESS CODEX)

12. THE SIMPLEST THEME POSSIBLE IS A
CHILD THEME
WHICH
INCLUDES ONLY A STYLE.CSS FILE,
PLUS ANY IMAGES. THIS IS POSSIBLE BECAUSE IT IS
A CHILD OF ANOTHER THEME WHICH ACTS AS
ITS PARENT.
(WORDPRESS CODEX - CURRENT)

13. HOW MANY FILES
YOU NEED?

14. STYLE.CSS
INDEX.PHP

15. TEMPLATE HIERARCHY

16. CHILD THEME
• /WP-CONTENT/THEMES/
• WP-ADMIN
• STYLE.CSS*
• FUNCTIONS.PHP + OTHER TEMPLATE FILES
• FOLDERS WITH MEDIA, JS, CSS ETC.

17. STYLE.CSS
1: /*
2: Theme Name: Child Theme Name
3: Theme URI: Child Theme URI
4: Description: Our description of theme
5: Author: Authors name
6: Author URI: Authors website
7: Template: twentyeleven
8: Version: 1.0
10: General comments/License Statement if any.
11: */

18. STYLE.CSS
1: /*
2: Theme Name: Child Theme Name
3: Theme URI: Child Theme URI
4: Description: Our description of theme
5: Author: Authors name
6: Author URI: Authors website
7: Template: twentyeleven
8: Version: 1.0
10: General comments/License Statement if any.
11: */

21. STYLE.CSS
1: /*
2: Theme Name: Child Theme Name
3: Theme URI: Child Theme URI
4: Description: Our description of theme
5: Author: Authors name
6: Author URI: Authors website
7: Template: thematic
8: Version: 1.0
10: General comments/License Statement if any.
11: */
12:
13: @import url(‘../thematic/style.css’);

23. STYLE.CSS
1: /*
2: Theme Name: Child Theme Name
3: Theme URI: Child Theme URI
4: Description: Our description of theme
5: Author: Authors name
6: Author URI: Authors website
7: Template: thematic
8: Version: 1.0
10: General comments/License Statement if any.
11: */
12:
13: @import url(‘../thematic/style.css’);
14
15: body { background-color: cyan; }

25. FUNCTIONS.PHP
CHILD
1: <?php
2: function theme_special_nav() {
3: // Do something.
4: }
5: ?>

26. FUNCTIONS.PHP
PARENT
1: <?php
2: if (!function_exists('theme_special_nav')) {
3: function theme_special_nav() {
4: // Do something.
5: }
6: }
7: ?>

27. RTL.CSS TAG.PHP
INDEX.PHP TAXONOMY.PHP
COMMENTS.PHP AUTHOR.PHP
FRONT-PAGE.PHP DATE.PHP
HOME.PHP ARCHIVE.PHP
SINGLE.PHP SEARCH.PHP
SINGLE-<POST-TYPE>.PHP ATTACHMENT.PHP
PAGE.PHP IMAGE.PHP
CATEGORY.PHP 404.PHP

28. MODULES

29. STYLE.CSS

32. FUNCTIONS.PHP
1: <?php
2:
3: function childtheme_create_stylesheet() {
4: $templatedir = get_bloginfo('template_directory'); //parent folder
5: $stylesheetdir = get_bloginfo('stylesheet_directory'); //child folder
6: ?>
7: <link rel="stylesheet" type="text/css" href="<?php echo $templatedir
?>/library/styles/reset.css" />
8: <link rel="stylesheet" type="text/css" href="<?php echo $templatedir
?>/library/styles/typography.css" />
…
20: <?php
21: }
22: add_filter('thematic_create_stylesheet', 'childtheme_create_stylesheet');
23: ?>

33. FUNCTIONS.PHP
1: <?php
2: /** register with hook 'wp_print_styles' */
3: add_action('wp_print_styles', 'add_my_stylesheet');
4:
5: /* * Enqueue style-file, if it exists. */
6: function add_my_stylesheet() {
7: //Parent theme style
8: $parentStyleUrl = get_template_directory_uri().‘/style.css’;
9: if ( file_exists($myStyleFile) ) {
10: wp_register_style(‘parentStyleUrl', $parentStyleUrl );
11: wp_enqueue_style(‘parentStyleUrl');
12: }
13: //Child theme style
14: $childStyleUrl = get_stylesheet_directory_uri().‘/style.css’;
15: if ( file_exists($ childStyleUrl ) ) {
16: wp_register_style('childStyleUrl', $childStyleUrl );
17: wp_enqueue_style( ‘childStyleUrl');
18: }
19: }
20: ?>

34. WP MINIFY
CSS: WP_ENQUEUE_STYLE
JS: WP_ENQUEUE_SCRIPT

35. WHEN IS IT GOOD?

36. FRAMEWORK

37. DRY & DIE

38. PAGE.PHP
1: <?php
2: /*
3: * Page template
4: */
5: get_header();
6:
7: //Sub Menu Part
8: get_template_part(‘submenu’); // gets submenu.php file
9:
10: //Standard loop for page
11: get_template_part(‘content’, ‘page’); // gets content-page.php file
12:
13: //Latest News
14: get_template_part(‘news’); // gets news.php file
15:
16: get_footer();
17:
18: ?>

40. REMEMBER

41. USE TECHNOLOGY
1:
2: <a href=‘<?php echo get_permalink(39) ?>’>
3: <?php echo get_the_title(39) ?>
4: </a>
5:

42. ABUSE TECHNOLOGY
1:
2: <a href=‘<?php echo get_permalink(39) ?>’>
3: <?php echo get_the_title(39) ?>
4: </a>
5:

43. USE TECHNOLOGY
1: <?php
2: get_header(); // header.phg
3: get_header(‘single’); // header-single.php
4:
5: get_sidebar(); // sidebar.php
6: get_sidebar(‘left’); // sidebar-left.php
7:
8: get_template_part( 'loop', 'index' );
9: // wp-content/themes/child/loop-index.php
10: // wp-content/themes/child/loop.php
11: // wp-content/themes/parent/loop-index.php
12: // wp-content/themes/parent/loop.php
13:
14: get_footer(); // footer.php
15: get_footer(‘category’); // footer-category.php
16:
17: load_template(TEMPLATEPATH . '/template-name.php');
18:
19: locate_template($template_names, $load);
20:
21: include(get_query_template(‘404')); //404.php
22: include(get_404_template()); //404.php
23:
24: ?>

44. CLIENT
≠
CODER

45. WYSiWYG

46. WYSiWTF

47. THANK YOU!
MARCIN WOLAK
WWW.MARCINWOLAK.PL
KONTAKT@MARCINWOLAK.PL