Courtney O'Callaghan 2:20 am on September 19, 2013
Tags: themes ( 8 ), training ( 37 )

Theme School Curriculum

Below I have set out the topics and layout for the theme school training modules.Please take a look and get back to me if you are interested! For those who were at Contribute Day at WCSF, please contact me if you have any materials already created (outside of the videos that were recorded) so we can use the awesome content you all worked on already.

The basic layout for each section module would be:

a short intro in what you will learn (written or video)
voice over screencast walk through (user could follow along if they wanted to)
2-3 practice examples
self quiz for each topic

Here are first thoughts on sections of the theme school. There are probably too many in some sections and not enough in others. I am sure I missing some of the topics we covered at Contribute Day – please remind me what topic you worked on so i can include it. I look forward to seeing everyone’s ideas 🙂

What is a Theme
- How does a theme interact with WP
- What is a framework (definition)
- What is a child themeChild theme A Child Theme is a customized theme based upon a Parent Theme. It’s considered best practice to create a child theme if you want to modify the CSS of your theme. https://developer.wordpress.org/themes/advanced-topics/child-themes/. (definition)
- What is CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. or Role of CSS in WP theme
Theme Basics
- Setting up Local InstallLocal Install A local install of WordPress is a way to create a staging environment by installing a LAMP or LEMP stack on your local computer. of WP
- Theme Standards & Best Practices
- Basic Files & Structure: Anatomy of a Theme
  - see: http://yoast.com/wordpress-theme-anatomy/
- Template Hierarchy
- Template Tags
- Post Formats
- Files & Structure 2: Deconstructing twentytwelve (or other) file structure
  - perhaps broken down into HeaderHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes., Sidebars, Navigation, Stylesheet, etc.
- Page Templates
- Images (best practices)
- CSS troubleshooting
Altering a Theme: Child Themes
- Child theme basics (unless covered in basics)
- Picking a parent theme
- Creating child theme
  - functions.php
  - style.css
  - adding / overwriting other files
- Common requests
- Adding Additional Widgeted Spaces
Turning HTMLHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. design/website into WordPress theme
- Breaking design into modules via WordPress file structure
- The LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. & your site
- Common Issues
Creating a theme from scratch
- Using a starter theme
  - _s (underscores)
  - toolbox
Advanced/Other
- Theme CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings. integration
- Custom Post TypeCustom Post Type WordPress can hold and display many different types of content. A single item of such a content is generally called a post, although post is also a specific post type. Custom Post Types gives your site the ability to have templated posts, to simplify the concept. Templates
- Print Friendly stylesheet
- Responsive Themes
- Internationalization
- Theming Admin Dashboard
- BuddyPress / MS
- AccessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility)
- Testing your theme / Debugging
- Theme Review aka Submitting Theme to WP

unsure if these would be appropriate / where to put them…

Web Fonts
How do i create my own theme/what does it mean to create a theme
Conditional tags
The Loop explained
wp-query best practices
Custom fields
Custom post types

#themes, #training

Catia Kitahara 3:19 am on September 19, 2013

It looks great. My suggestions:
I believe The LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. Explained would do best under the loop and your site. Conditional tags could go under Common Issues or together with Template tags. wp-query best pratices are very important, I think they should go with template hierarchy or with The Loop Explained. Custom post types should go before Custom post typeCustom Post Type WordPress can hold and display many different types of content. A single item of such a content is generally called a post, although post is also a specific post type. Custom Post Types gives your site the ability to have templated posts, to simplify the concept. templates, I don’t see how you learn one without the other. Web fonts could go under CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. troubleshooting, custom fields could go with the advanced stuff.
About the order, I think the Altering a Theme: Child Themes should go after Creating a Theme from scratch. Though it’s quite easy, I don’t think it’s good to make a child themeChild theme A Child Theme is a customized theme based upon a Parent Theme. It’s considered best practice to create a child theme if you want to modify the CSS of your theme. https://developer.wordpress.org/themes/advanced-topics/child-themes/. without knowing/undertanding how a theme works.
As I said before, I helped thinking about a Template Hierarchy for Beginners on the Contributor DayContributor Day Contributor Days are standalone days, frequently held before or after WordCamps but they can also happen at any time. They are events where people get together to work on various areas of https://make.wordpress.org/ There are many teams that people can participate in, each with a different focus. https://2017.us.wordcamp.org/contributor-day/ https://make.wordpress.org/support/handbook/getting-started/getting-started-at-a-contributor-day/., if nobody kept the materials, I think I can remember what we did. Do you know who would have kept it, so we can ask?
- Catia Kitahara 3:34 pm on September 23, 2013
  
  Michele langston has it. I’ve talked to her on Twitter and she’ll send it to us.
  - Catia Kitahara 4:12 pm on September 25, 2013
    
    @courtneydawn, Michelle has sent it to me. Christine Rondeau also sent me some documents written durign the Contributor DayContributor Day Contributor Days are standalone days, frequently held before or after WordCamps but they can also happen at any time. They are events where people get together to work on various areas of https://make.wordpress.org/ There are many teams that people can participate in, each with a different focus. https://2017.us.wordcamp.org/contributor-day/ https://make.wordpress.org/support/handbook/getting-started/getting-started-at-a-contributor-day/.. Do you have an email for me to send you it all?
    - courtneydawn 4:23 pm on October 3, 2013
      
      you can send to courtneydawn at gmail
karmatosed 2:18 pm on September 19, 2013

Looks really well thought out. I have a few ponders which really just are minor.

1. I see creating a theme from scratch and using a starter or toolbox. It probably is good to also look at 100% rolling your own. It’s going to probably be out of scope to go over the entirety of that but very worth touching on. Not everyone uses (or wants to use) a starter/toolbox.

2. It feels like it’s missing the start of the journey a little. I’d love to see a section on process. I’d also love to see one on sketching, one on wireframing and one on style guide. I always refer to this as my ‘R&D’ part of a process so perhaps that’s a good working title. I put my hand up for that bit at wcsf and happy to again.

I’d be happy to help with BuddyPress but keen it doesn’t get lumped with MS. This probably is the ‘extra’ section so hence the grouping, but in the recent codex study most are using without MS so be great to cut that tie a bit.
- Aaron Jorbin 10:07 pm on September 24, 2013
  
  I agree with #2. Sketching, discovery and the pre-design steps would be awesome additions.
Kat Hagan 9:43 pm on September 20, 2013

I’ve got our team’s notes about The LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop., querying posts, actions and filters; we built a basic example that incorporates all those ideas, and were each going to record a screencast for a segment of its creation. (I still have the script for my screencast, but haven’t created it yet.)
- courtneydawn 4:27 pm on October 3, 2013
  
  i can add you to our new blog digs – i just need the email address you use on wp.org
courtneydawn 6:02 pm on September 23, 2013

I am going to create a page tomorrow and then start implementing the suggestions!
Tracy Levesque 6:11 pm on September 23, 2013

I have materials written for child themes and custom post types. This weekend I am teaching a 2-day theming class for Girl Develop It Philly and after that I will have more materials on a lot of the topics posted above.
Aaron Jorbin 10:13 pm on September 24, 2013

Great start! A few ideas that I have are:

Putting an early section on the languages of themes, and what is php, htmlHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites., css, and javascriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com/.. This could go over the role of each, what each looks like, and where to get more info on each one.

I think accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) should be moved out of the advanced section an into the theme basics section, as it may put people off that making a theme accessible requires some super advanced skills. It’s also something that to do correctly needs to be thought about at every stage of the game.
Pingback: WordPress › Docs Meetup Roundup – Sept 26, 2013 « Make WordPress Documentation
Eric Amundson 3:33 pm on October 3, 2013

@courtneydawn I’m Eric from the WP Docs Team & editor of the Theme Dev Handbook. Siobhan asked me to pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” you to see how we might help each other. Ideas?
- courtneydawn 4:22 pm on October 3, 2013
  
  Eric – yes – help please! are you available to chat this week / weekend?
  - Eric Amundson 4:32 pm on October 3, 2013
    
    Hey @courtneydawn – yes. We’re having a Virtual Docs MeetupMeetup Meetup groups are locally-organized groups that get together for face-to-face events on a regular basis (commonly once a month). Learn more about Meetups in our Meetup Organizer Handbook. this Saturday at 10am – 2pm PDT on IRC – want to pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” me on #wordpress-sfd?
    - courtneydawn 4:34 pm on October 3, 2013
      
      sure – i will check in with you at the virtual meetupMeetup Meetup groups are locally-organized groups that get together for face-to-face events on a regular basis (commonly once a month). Learn more about Meetups in our Meetup Organizer Handbook.!
      - Eric Amundson 4:44 pm on October 3, 2013
        
        Terrific! Talk to you on Saturday then. 🙂
Omielette 9:25 pm on October 30, 2013

Hello! I am interested in getting involved with WordPress documentation. I have a background in instructional design, so I am especially interested in helping out with the Theme School Curriculum. What can I do to get involved?
Thanks,
Omie
Pingback: WordPress › Docs Meetup Roundup – Oct 3, 2013 « Make WordPress Documentation

Welcome!

Get Involved

Let’s Talk

Learn More

Theme School Curriculum

Welcome!

Get Involved

Let’s Talk

Learn More

Share this: