[Related Course: Create a Custom Block Theme #1] Different Types of Themes: Overview - Lesson Plan

[wparasae]

IMPORTANT:

** This lesson plan belongs to part of a greater course, Create a Custom Block Theme #1 **
Please reach out to @arasae (Sarah Snow) in the #training team Slack if you would like to help with this lesson plan.

Topic Description

The goal of this lesson is ultimately to orient learners to the different kinds of themes that exist; before someone can decide they want to design a block theme for the very first time, it's important that they be aware of the pros and cons of developing this kind of theme for people who might utilize their custom theme as well.

Intermediate users may only be familiar with classic themes at this point and may need an introduction to block themes. It's important that this lesson not only details the differences between these themes, but provides resources to learning materials to help them get familiar with the site editor. This lesson should not teach people how to use the site editor, but rather provide a high-level overview and resources for people to learn more if this is the wrong course for them at the moment.

Objectives

After completing this lesson, participants will be able to:

• Define classic, block, hybrid, and universal themes from a developmental perspective
• Analyze the pros and cons of different types of themes from a user's perspective

Guidelines

Review the [team guidelines] (https://make.wordpress.org/training/handbook/guidelines/)

Development Checklist:

• Review any related material on Learn
• Description and Objectives finalized
• Gather links to Support, other learn.wordpress.org existing resources, and Developer Docs
• Create an outline of the example lesson walk-through
• Draft lesson plan
• Add assessment questions to Sensei (and double-check that they work.)
• Check flashcards and attempt to recover the lost content there -- probably use a gallery instead of a flashcard here with images.
• Copy edit
• Style guide review
• Instructional Review
• Final review
• Publish
• Announce to the Training team
• Announce to lesson plan creator
• Announce to marketing
• Gather feedback from lesson plan users about the quality

Repo Structure and Lesson Plan Template

Please remove all blockquote comments such as this before publishing.

Target Audience

Who is this lesson intended for? What interests/skills would they bring? Put an "x" in the brackets for all that apply.

• Users / Content Writers
• Designers
• Beginner-Level Developers
• Developers
• Speakers
• Organizers
• Kids

Experience Level

How much experience would a participant need to get the most from this lesson? Put an "x" in the brackets for all that apply.

• Beginner
• Intermediate
• Advanced

Type of Instruction

Which strategies will be used for this lesson plan? Put an "x" in the brackets for all that apply.

• Text-and-Image-Based, Remote-First Course
• Exercises
• Slides
• Video Tutorial

Time Estimate (Duration)

How long will it take to present this lesson? Put an "x" in the brackets for the one that applies.

• 1-5 Minutes
• 5-10 Minutes
• 15+ Minutes
• 1 hour or less

Prerequisite Skills

Participants will get the most from this lesson if they have familiarity with:
These are important to include in case someone wants to use this lesson plan in-person as a stand-alone lesson.

• The full site editing experience
• The difference between templates, template parts, and
• How to use the block editor
• The general WordPress dashboard
• Installing and activating different themes
• The difference between content and design
• What CSS is (but not necessarily how to write it)

Readiness Questions

These are important to include in case someone wants to use this lesson plan in-person as a stand-alone lesson.

• Have you ever used the site editor before?
• Can you describe the difference between the 'edit site' button and the 'edit page' button.
• Have you ever installed and activated a theme before?
• How comfortable are you with the WordPress dashboard?

Slides

If someone wanted to run this lesson as a stand-alone Online Live Workshop or at an in-person WordCamp, you could create slides for this here; if you run a Live Online Workshop on one of these topics or find someone else has, related slides would be welcome!

This could be an interesting social learning space; this has not yet been run, though, so no slides exist.

Change the /repo-name/ in the link to match the URL name of this repo.

• Slides (files included in this repo)

Materials Needed

• A clear example of the site editor + descriptive alt text
• A clear example of the customer + descriptive alt text
• CONTRIBUTION OPPORTUNITY: Detailed reasons from users of why they love block themes and why they love classic themes.
• Screenshots of each step in the Exercise + Descriptive Alt Tags.
• A local, self-destructing development environment for people to explore the difference between classic and block themes.

• A local install of WordPress
• The files for the TwentySixteen theme

Notes for the Presenter

/Include any tips needed to present this topic for a Live Online Workshop or in an in-person classroom setting.

I worked in the open in a #training team Slack thread as I developed this lesson plan; the thread can be read there.

• Note 1
• Note 2

A list of any handy tips or other information for the presenter.

For example:

• Participants may need to download the TwentySixteen theme before beginning
• What to do if there’s no projector or internet available
• What to do if a participant doesn’t have the necessary set up
• How to handle different opinions about the topic

Lesson Outline

• Hook: There's a new kind of theme in town. (Goal: Generate excitement around block themes).
• Self-Check: Are you in the right place? Good spot for readiness questions and links to remediation.
• Mini-Lesson: The difference between different kinds of themes.
• Why people like classic themes - the benefits.
• Why people like block themes - the benefits.
• Closure + Prompt for Next Lesson: Quiz + Idea: One key benefit to block themes is that they can be designed from start to finish, touching almost no code at all. Which is why you're here, to learn how!

Exercises

What someone will DO with what they learn in each lesson; most lessons have at least one related exercise.

See For Yourself: Compare and Contrast a Block and Classic Theme (Optional Exercise)

Do you want to see the difference between a block and classic theme for yourself? Well, you're in luck! Tap this magic link to create a temporary website that will last X hours (no more than 2 if we can swing it). Then, follow the directions below to compare the differences.

• 1. Click THE LINK I WILL PROVIDE LATER I HAVE TO SET UP THE ENVIRONMENT FIRST to create a brand new installation of WordPress.
• 2. Go to Appearance > Themes > Add new. Search for the 2017 theme. Install and activate this theme.
• 3. Click on 'Customize' (under 'Appearance')
• 4. What options do you notice? Write down a list. There are no right or wrong answers; what is easy for you to do? What is a challenge? Can you do the following things? (Need specific examples)
• 5. Now, head back to your WordPress Dashboard. Go to Appearance > Themes> Add New. search for the 2020 theme. Install and activate this theme.
• 6. Click "Editor" (under appearance.)
• 7. What do you notice? (Remediation videos for using list view, global styles, etc.)
• 8. Can you change X link color? (need specific examples).

Assessment

These assessments will be auto-graded on Learn.WordPress.org; there are some limitations, but we may be able to develop work-arounds that help learners assess their own learning.

1. By default, which type of theme(s) allow the option of using the Customizer? Select all that apply.
   Note: Some plugins may extend WordPress themes to access the customer; for this question, imagine there are no plugins installed, just the theme and WordPress itself.
   [get a photo to show an image of the customizer + solid alt description]

a. Classic Themes (Correct)
b. Hybrid Themes (Correct)
c. Universal Themes (Correct)
d. Block Themes
e. All of the above.

2. If someone wanted to use the new Site Editor (available with WordPress 5.9 and later), what type of theme would you recommend they use?
   [Include a picture of the site editor and make sure there is a good Alt Description]
   a. Classic Theme
   b. Block Theme (Correct)
   c. They shouldn't use a theme, they should use a plugin.
   d. Both of the above types of themes will work.

3. If someone wanted to change the color of a link using a classic theme, what tool would they need to use?
   a. CSS code (correct)
   b. Global Styles in the Site Editor
   c. PHP
   d. Javascript

4. If someone wanted to change the color of a link using a block theme, what tool would they need to use?
   a. CSS code
   b. Global Styles in the Site Editor (correct)
   c. PHP
   d. Javascript

5. Essay Question: (Open a Microsoft Word document and write down your answer. When you are finished, use the rubric below to analyze your answer. How did you do?)

In your own words, what are the advantages for a WordPress user to install a block theme? Consider: What might be some drawbacks? Write at least three sentences. Then, click the button below to reveal an example of the "right" answer. Finally, use the rubric below to grade your own work. Please answer honestly so we can evaluate how well our course is working!

This is the kind of question meant to help you retain information; you will get out of it what you put into it, so please answer thoughtfully!

Additional Resources

• Resource 1
• Resource 2

An optional section which can contain a list of resources that the presenter can use to get more information on the topic.

For example:

• Link to information on the Codex
• Theme Review Team's Handbook

Example Lesson [Written for a text-and-image based, multimedia course rather than for a live classroom setting]

An example of how the lesson plan can be implemented. Written in script form as one possible way a presenter might use this lesson plan at an event, with screenshots and instructions if necessary.

Section Heading for Example Lesson

You will likely need to break the Example Lesson down into multiple sections.

Lesson Wrap Up

Follow with the Exercises and Assessment outlined above.

[wparasae]

CONTRIBUTE WITH ME!

Ya'll, I am looking for content for this lesson. Specifically, I want to know your opinion on one or both of these questions:

1. What do you love about Classic Themes?
2. What do you love about Block Themes?
3. Would you describe yourself as a: (Optional)

• Beginning / Intermediate User
• Advanced User
• Designer
• Developer
• Extender
• Other (write it out!)

4. What is your DotOrg username? (Mine is @arasae, which is different than my GitHub username.) Optional.

Please reply here in Github as a comment, or (if you don't have access for whatever reason), you can post your answers in the thread in the #training team thread. Keep your comments positive about the different kinds of themes and add them below in a comment on this lesson plan. I'm not sure what we will do yet to acknowledge those of you who might help with our course, but I want to make sure I'm keeping track when that decision on how to acknowledge you is made!

Why do I need this? Ya'll, the WordPress community, are brilliant. I would like to aggregate your comments to help create the content for this lesson, potentially pull some quotes out, and explore what the community thinks (rather than what I might assume). Please note that most comments will be re-written for the purpose of this lesson plan -- I may use part, all, or a general idea of what you suggest; this is a community brainstorm, and we'll see how it goes!

[wparasae]

These readiness questions and pre-requisite skills are going into the main course overview, not the actual lesson plan itself. We may consider omitting them from the lesson plan.

[wparasae]

Added another step (adding assessment questions to Sensei to make sure I don't forget, but those will slow me down atm, so I will come back to this.

[wparasae]

Quick contribution:

1. Easy editor for new bloggers to write/edit blogs.
2. Block themes give the power to create amazing static & dynamic websites.
3. Developer.
4. Credit: @vKrish

[wparasae]

Classic themes are easy to use and pretty solid for who’s just starting out. You can write/edit/publish posts or pages easily without thinking about complex customizations.
Block themes lets you create custom blog posts and also pages using drag and drop builder. The blocks gives you the opportunity of creating amazing looking pages where you can add almost anything you need. Most importantly without any coding knowledge.
Advanced User/ Marketer
.org: aion11, Github: maion11

[wparasae]

This Module is Ready For Review: https://learn.wordpress.org/learn/lesson/different-types-of-themes-overview/

[wparasae]

One of the things I'm finding in using lesson plans to courses is that lesson plans dive deeply into course content; they teach both the "need to knows" and the "nice to knows" about each thing. However, courses need to take into account these "need to knows" vs. "nice to knows" in order to better address our adult learner's lack of time. Therefore, I'm adjusting the assessment questions and working to only include the "need to knows" to provide necessary content.