Intro to Site Editor and Templates - Lesson Plan

[courtneyr-dev]

Related Resources:

• https://learn.wordpress.org/lesson-plan/templates/
• https://learn.wordpress.org/lesson-plan/template-parts/
• https://wordpress.org/support/article/site-editor/
• https://learn.wordpress.org/workshop/intro-to-the-site-editor-and-template-editor/

Development Checklist:

• Draft lesson plan
• Copy edit
• Style guide review
• Instructional Review
• Final review
• Publish
• Description and Objectives finalized
• Gather links to Support and Developer Docs
• Define several SEO keywords to use in the article and where they should be prominently used
• Consider any MarComms (marketing communications) resources and link to those
• Review any related material on Learn
• Create an outline of the example lesson walk-through
• Announce to 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.

Description

A short paragraph explaining what is covered in the lesson plan. This should be text that can be copied and used in a meetup or workshop description.

Objectives

After completing this lesson, participants will be able to:

• Objective 1
• Objective 2

It’s required that you include a bulleted list of objective(s) for each lesson plan. Objectives should be worded as actions that the participant can do once they’ve finished. See Bloom's Taxonomy of Action Verbs (PDF) as a reference. Avoid using words like "know," "understand," "be introduced to," etc. There should be one assement item for each objective (see below).

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
• 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.

• Demonstration
• Discussion
• Exercises
• Feedback
• Lecture (Presentation)
• Slides
• Show & Tell
• 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 hour or less
• 2-4 hours (half-day)
• 5-8 hours (full-day)
• 2 days
• 3 days or more

Prerequisite Skills

Participants will get the most from this lesson if they have familiarity with:

• Skill 1
• Skill 2

For example:

• Experience with HTML and CSS
• Completed the Basic WordPress Concepts lesson

Readiness Questions

• Question 1
• Question 2

A list of questions for participants to see if they have the background and skills necessary to learn and understand the lesson.

For example:

• Do you want to makes changes to your theme yourself?
• Do you know how to write CSS?

Slides

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

• Slides (files included in this repo)

Materials Needed

• Item 1
• Item 2

A list of files, resources, equipment, or other materials the presenter will need for the lesson.

For example:

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

Notes for the Presenter

• 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

• First do this
• Then move on to this
• Finish with this

The plan for the lesson. Outline form works well.

For example:

• Talk about what a theme is
• Demonstrate how to install and activate a theme
• Practice exercises to have participants find and install a theme on their own site

Exercises

Exercise name

Short description of what the exercise does and what skills or knowledge it reinforces.

• Short point or step of the exercise
• And another one

These are short or specific activities that help participants practice certain components of the lesson. They should not be fully scripted exercises, but rather something that participants could do on their own. For example, you can create an exercise based on one step of the Example Lesson.

Assessment

There should be one assement item (or more) for each objective listed above. Each assessment item should support an objective; there should be none that don't.

Write out the question.

1. Option
2. Option
3. Option
4. Option

Answer: 3. Correct answer

A few questions to ask participants to evaluate their retention of the material presented. They should be a measure of whether the objectives were reached. Consider having a question for each objective.

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

An example of how the lesson plan can be implemented. Written in script form as one possible way an 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.

[courtneyr-dev]

This lesson makes sense of Templates in FSE. However, we should include the developer explanation of templates an possibly have a dev oriented lesson about what templates have meant before FSE. The earlier explanation is still valid. How users can access modifying templates in FSE is much easier. Expanding the context of what templates are could suffice.
https://developer.wordpress.org/themes/basics/template-files/

[azhiya]

Please review:

• [HelpHub] Site Editor Documentation-Issue-Tracker#305
• [HelpHub] Template Editor Documentation-Issue-Tracker#306

[westnz]

> This lesson makes sense of Templates in FSE. However, we should include the developer explanation of templates an possibly have a dev oriented lesson about what templates have meant before FSE. The earlier explanation is still valid. How users can access modifying templates in FSE is much easier. Expanding the context of what templates are could suffice. https://developer.wordpress.org/themes/basics/template-files/

I assume this refers to creating a different lesson plan by someone else? @courtneyr-dev

[westnz]

Here is the link to the Lesson Plan.

[westnz]

Hi @azhiya I have reviewed the links you shared and tested the Site Editor and Templates with WordPress 6.0-RC2. This lesson plan aligns with the 6.0 release. It is ready to be reviewed and published.

[azhiya]

Thanks @westnz I'll move it to Ready to review.

[azhiya]

Hi @westnz
Is it possible to increase the font size of the list view screenshot? Other than that all looks good.
One thing that I did notice is that you make reference to Love Travelling.

Once in your dashboard, click on Love Travelling and this will take you directly to your site.

Would it be a good idea to provide the Presenter with a zip file of the site so that they can use it or should it be generic like click on your Website name/logo?

[westnz]

Hi @azhiya, I have changed the reference to 'Love Travelling'. Thanks for picking that up. The screenshot you referred to was not to only highlight the List View section, but to visually reflect the example discussed before the image: "When you create a template, you get the best use when you separate the reusable parts from the dynamic part. The dynamic part is the content part that will change for every page that uses the template. The usable parts are the static parts of the template that will stay the same. For example, the header and the footer. In this example, I’ve updated the page template. As you will see, we have a new header template part, a new footer template part, and the Post Content block displays the content of the page assigned to this template." It is therefore important to see the entire page. Is it then okay if we keep the screenshot as is?

[azhiya]

Thanks @westnz That makes sense now. Yes, I think this is now good to go.

[westnz]

Published Lesson Plan: https://learn.wordpress.org/lesson-plan/intro-to-site-editor-and-templates/

[abhansnuk]

Updating notes from earlier in the week:

• reviewed lesson plan
• two questions remain for @azhiya and @courtneyr-dev , which have wider impact:
  i) Are we using words in caps, eg 'DON'T' or can we emphasize these in bold to avoid issues for screen readers?
  ii) Are we completing the SEO field in JetPack at this stage, and if not, are we flagging them on GitHub in a particular one to come back to? Do we need a label for this in GitHub?

I have given the published link to this lesson plan to Femy, who is finishing up the updates on docs for this topic, and will update the Lesson Plan if needed, when that update is published.
Thanks.

[courtneyr-dev]

Ideally we should not use contractions if we follow the style guides from training & docs. https://make.wordpress.org/training/handbook/guidelines/lesson-plan-style-guide/ and https://make.wordpress.org/docs/style-guide/language-grammar/contractions/.

[westnz]

I have updated the words in caps to lower case and bold.

[westnz]

Updated

[courtneyr-dev]

6.2 (44770), (45100), (46458)

[courtneyr-dev]

6.3 WordPress/gutenberg#47142

https://make.wordpress.org/core/2023/03/22/whats-new-in-gutenberg-15-4-22-march/#updated-template-descriptions

[courtneyr-dev]

https://make.wordpress.org/core/2023/05/20/whats-new-in-gutenberg-15-8-may-17/#add-the-pages-menu-to-the-site-editor-50463

6.3

[courtneyr-dev]

https://make.wordpress.org/core/2023/06/14/whats-new-in-gutenberg-16-0-14-june/#page-management 6.3

[westnz]

Anyone is welcome to pick up this lesson plan.