From http://www.meetup.com/Milwaukee-WordPress-MeetUp/events/227272150/ This is a daytime meetup with a topic. Geoff Myers, Digital Marketing Consultant & CEO of SimDex LLC, will be presenting. This week's topic is "How to Choose the Right Theme & Customize It the Right Way (Using a Child Theme)". Who should attend this event? This short 20-minute presentation and subsequent group discussion is meant for both beginners of WordPress ("choosing the right theme") and intermediate users of WordPress ("creating a child theme"). Following the talk, there will be a general Q&A session and group discussion, after which we will break up into smaller groups as usual for individual conversations. What will I learn from this talk? Geoff will be covering the following subtopics: • Where do I start when searching for a WordPress theme for my site? What are the best places to look for high-quality themes? • What do I look for in a WordPress theme to determine whether it meets the highest technical quality standards? (hint: use Theme Check) • Effective strategies and best practices for choosing a WordPress theme that will work for you in the short term and long run (i.e. how to save yourself frustration later on) • Free themes versus paid themes: What's the difference? Is it worth paying? Where should I go? • How to create a Child Theme and add customizations without overwriting the original theme's code (e.g. copying and editing CSS stylesheets and PHP templates from the original theme) What is the format of this event? • Geoff's presentation/talk (~20 minutes) • Subsequent Q&A and group discussion (~15 minutes) • Group collaboration/help session (the usual, ~70 minutes) If we receive positive feedback about this type of event, we will plan future events in a similar format.

1. HOW TO CHOOSE THE RIGHT THEME
& CUSTOMIZE IT THE RIGHT WAY
(BY USING A CHILD THEME)
GEOFF MYERS PRESENTS

2. BEFORE WE BEGIN…
ABOUT GEOFF MYERS
▸ Founded SimDex in 2004
▸ Web Solutions for Small + Medium Sized Businesses
▸ Digital Marketing Consultant + Strategist
▸ 10+ Years as Full Stack Web Designer + Developer
▸ 5+ Years of WordPress Experience
▸ 50+ WordPress Sites Built
▸ Computer Science Background
▸ Get In Touch: geoff@simdex.org | simdex.org | 414.455.6675

3. HOW TO CHOOSE
THE RIGHT THEME
PART 1 OF 2:
Experience Level: Beginner–Intermediate

4. HOW TO CHOOSE THE RIGHT THEME
WHAT SHOULD I CONSIDER WHEN RESEARCHING A THEME?
1. Features + Functionality
2. User Interface + Experience (UI/UX)
3. Customization + Flexibility
4. Responsive Design + Mobile Friendliness
5. Search Engine Optimization (SEO)
6. Performance + Speed
7. Security + Stability
8. Developer + Community Support

5. HOW TO CHOOSE THE RIGHT THEME
1. FEATURES + FUNCTIONALITY
▸ Included Page Templates + Post Formats
▸ Custom Post Types + Taxonomies (portfolio, listings, testimonials…)
▸ Industry Specific Features (real estate, education…)
▸ Included Widgets + Shortcodes
▸ Advanced Search + Navigation
▸ Social Media Integration
(Facebook, Twitter…)
▸ Other 3rd Party Integrations
(MailChimp, Google Analytics…)

6. HOW TO CHOOSE THE RIGHT THEME
2. USER INTERFACE + EXPERIENCE (UI/UX)
▸ Familiar Design Conventions
▸ Simplicity + Ease of Use
▸ Logical User Flows
▸ Content Focused
▸ Clear Calls to Action (CTAs)
▸ Design Consistency
▸ Responsive Design (later slide…)

7. HOW TO CHOOSE THE RIGHT THEME
3. CUSTOMIZATION + FLEXIBILITY
▸ Theme Design Options (universal parameters)
▸ Page Design Options (individual post parameters)
▸ Header + Footer + Sidebars
▸ Widget + Menu Areas (top, left, right…)
▸ Custom CSS + JavaScript Code
▸ Visual Page Builder (later slide…)
▸ Child Themes (later slide…)

8. HOW TO CHOOSE THE RIGHT THEME
4. RESPONSIVE DESIGN + MOBILE FRIENDLINESS
▸ Ideal User Experience for All Screens + Networks
▸ Separate Layouts (desktop, notebook, tablet, smartphone)
▸ Fluid Grid System
▸ Flexible + Scalable Images
▸ Mobile Navigation Menus
▸ Touch Friendly UI Elements
(buttons, tabs, forms…)

9. HOW TO CHOOSE THE RIGHT THEME
5. SEARCH ENGINE OPTIMIZATION (SEO)
▸ High Quality Code (follows best practices)
▸ Clear Separation of Content + Design
▸ Custom Meta Titles + Descriptions
▸ Site Map
▸ SEO Plugins (Yoast SEO,
All in One SEO Pack,
Google XML Sitemaps)
▸ Performance + Speed (next slide…)

10. HOW TO CHOOSE THE RIGHT THEME
6. PERFORMANCE + SPEED
▸ Unnecessary Features + Functionality
▸ Code Optimization + Minification
▸ Image Optimization
▸ Testing Tools (Google PageSpeed,
GTmetrix, Pingdom)
▸ Caching Plugins (W3 Total Cache,
WP Super Cache)

11. HOW TO CHOOSE THE RIGHT THEME
7. SECURITY + STABILITY
▸ Updated Often (active development)
▸ Modern Technologies
▸ Large User Base (popular)
▸ Simpler is Usually More Secure
▸ Security Plugins (Sucuri,
iThemes Security, Wordfence)
▸ Developer + Community Support
(next slide…)

12. HOW TO CHOOSE THE RIGHT THEME
8. DEVELOPER + COMMUNITY SUPPORT
▸ Active Development
▸ Developer Support (usually paid annually)
▸ Frequent Updates
▸ Healthy Community
▸ High Quality Documentation
▸ Popularity Helps
▸ I Can Help You Too (simdex.org)

13. HOW TO CHOOSE THE RIGHT THEME
WHERE SHOULD I GO TO FIND A THEME?
▸ WordPress Theme Directory (wordpress.org)
▸ WooThemes (woothemes.com)
▸ Elegant Themes (elegantthemes.com)
▸ StudioPress (studiopress.com)
▸ Themeco (theme.co)
▸ Themify (themify.me)
▸ ThemeForest (themeforest.net)

14. HOW TO CHOOSE THE RIGHT THEME
WHAT ARE YOUR FAVORITE WORDPRESS THEMES?
▸ X by Themeco (theme.co)
▸ Divi by Elegant Themes
(elegantthemes.com)
▸ Themes Built on
Genesis Framework
▸ Themes Built on
Bootstrap Framework

15. HOW TO CHOOSE THE RIGHT THEME
WHAT IS A VISUAL LAYOUT BUILDER? WHAT ARE EXAMPLES?
▸ Visual GUI with drag + drop interface
▸ Quickly + easily build multicolumn layouts
▸ Little to no HTML or CSS coding required
▸ Examples
▸ Cornerstone by Theme.co
▸ Divi Builder by Elegant Themes
▸ Visual Composer by WPBakery
▸ Themify Builder by Themify.me
▸ Page Builder by Site Origin

16. THAT CONCLUDES PART 1.
BEFORE PART 2…
Questions?
Get In Touch:
geoff@simdex.org
simdex.org
414.455.6675

17. HOW TO CUSTOMIZE THEMES THE RIGHT WAY
(BY USING CHILD THEMES)
PART 2 OF 2:
Experience Level: Intermediate–Advanced

18. HOW TO CUSTOMIZE THEMES THE RIGHT WAY (BY USING CHILD THEMES)
WHAT IS A CHILD THEME? WHY SHOULD I USE ONE?
▸ Inherits Attributes from Parent Theme by Default
▸ Overrides Styles + Functions of Parent Theme
▸ Relies on Parent Theme to Function
▸ Does Not Modify Parent Theme
▸ Updates to Parent Theme Don’t
Override Customizations
▸ Easy to Update + Maintain

19. HOW TO CUSTOMIZE THEMES THE RIGHT WAY (BY USING CHILD THEMES)
THE “I LOVE CODE” APPROACH
1. Create new folder in …/wp-content/themes/
called {parent-theme}-child
2. Create two new plain text files*
in {parent-theme}-child called
styles.css and functions.php
*UTF-8 character encoding recommended

20. HOW TO CUSTOMIZE THEMES THE RIGHT WAY (BY USING CHILD THEMES)
THE “I LOVE CODE” APPROACH
3. Add the following header to styles.css, then edit:
/*
Theme Name: Twenty Fifteen Child
Theme URI: http://example.com/twenty-fifteen-child/
Description: Twenty Fifteen Child Theme
Author: John Doe
Author URI: http://example.com
Template: twentyfifteen
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout
Text Domain: twenty-fifteen-child
*/
/* your custom CSS begins here */

21. HOW TO CUSTOMIZE THEMES THE RIGHT WAY (BY USING CHILD THEMES)
THE “I LOVE CODE” APPROACH
4. Add the following header to functions.php, then edit:
<?php
add_action( 'wp_enqueue_scripts', 'my_parent_theme_css' );
function my_parent_theme_css() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
// copy and edit the line above for each stylesheet included in your parent theme
wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( 'parent-style' ) );
}
// your custom PHP begins here

22. HOW TO CUSTOMIZE THEMES THE RIGHT WAY (BY USING CHILD THEMES)
THE “I LOVE CODE” APPROACH
5. Activate child theme in WordPress admin
6. Copy desired template file(s) from parent theme folder to child
theme folder*
7. Modify copied template file(s) within child theme folder
‣ WordPress will first look in child theme folder for template files
and use them if they exist, otherwise parent theme’s templates
will be used
‣ Refer to WordPress theme template hierarchy for development
reference (next slide…)
*preserve directory hierarchy (relative file paths)

24. HOW TO CUSTOMIZE THEMES THE RIGHT WAY (BY USING CHILD THEMES)
THE “I HATE CODE” APPROACH: CHILD THEME CONFIGURATOR
1. Download and install Child Theme Configurator:
https://wordpress.org/plugins/child-theme-configurator/
2. Follow these step-by-step instructions:
http://www.childthemeconfigurator.com/how-to-use/
3. Add all custom CSS to styles.css within your child theme:
…/wp-content/themes/your-child-theme/styles.css
4. Add all custom PHP to functions.php within your child theme:
…/wp-content/themes/your-child-theme/functions.php
5. Activate child theme in WordPress admin
6. Advanced: Copy desired template file(s) from parent theme folder to
child theme folder then modify copied template file(s)

25. HOW TO CUSTOMIZE THEMES THE RIGHT WAY (BY USING CHILD THEMES)
THE “I HATE CODE” APPROACH: CHILD THEME CONFIGURATOR
Demo

26. THAT’S IT FOR NOW…
THANK YOU!
Questions?
Get In Touch:
geoff@simdex.org
simdex.org
414.455.6675