Custom Templates

[cynthianorman]

Details

• Content type: Lesson
• Content title: Custom Templates
• Topic description: Using the theme.json file, we will register a custom template we create from scratch.
• Audience: Developer
• Experience Level: Intermediate

Learning Objectives

• Build a custom template from scratch and export it to your local theme folder.
• Register a custom template using the theme.json file.
• Familiarize yourself with the workflow of updating templates using the Create Block Theme plugin.

Related Resources and Other Notes

• Custom Templates
• https://learn.wordpress.org/tutorial/creating-a-custom-template-with-the-wordpress-site-editor/
• https://learn.wordpress.org/lesson-plan/template-editor/

Automation Code

[github-actions]

Lesson Development Checklist

• Gather any relevant links to Support, Docs, or related material
• Description and Objectives finalized
• Lesson created and announced to the team for review
• Lesson reviewed
• Lesson video submitted and published to WPTV
• Lesson created on Learn.WordPress.org
• Lesson video published to YouTube
• Lesson on Learn.WordPress.org updated with YouTube video
• Lesson published to Learn.WordPress.org

[cynthianorman]

@jonathanbossenger how do you feel about this lesson's topic being shown primarily using the Create Block Theme plugin? I could include a brief mention of the Export zip file followed by copy/paste manual task. Recall we will already have the plugin topic covered in the Beginner Developer module.

[jonathanbossenger]

@cynthianorman I assume you mean using the Create Block Theme functionality to export the template created in the editor to a physical template file?

In that case, yes, I agree, going with a Create Block Theme functionality first, but mentioning other options as well makes sense.

To the best of my knowledge, the goal of Create Block Theme is to eventually become redundant, ie all it's functionality is eventually baked into the core. However, just like create-block is now the recommended tool to scaffold a new block, I do agree we should recommend folks use Create Block Theme when developing themes.

So if something is complicated or requires a manual process that Create Block Theme solves, I agree that we should recommend using Create Block Theme first, but also mention the alternatives.

[cynthianorman]

@jonathanbossenger this is the workflow I thought could work for this lesson. It actually uses the Save Changes option rather than Export.

Just a quick note on this in regards to the needed updates for the course A Developers Guide to Block Themes – Part 1. We had questions when it came to updating module 4 and custom templates. I wasn't sure which workflow would work best but I'm now thinking the one I've created here for this lesson would work for us.

1. With TT4 in Site Editor add a new template
2. Use Single Item: Post, select All Posts, and choose the pattern presented for posts
3. In the Site Editor, remove the featured image and Save changes (this saves your changes to the database)
4. Using the Create Block Theme plugin, Save Changes (this downloads the file to your themes folder)
5. Within your code editor, change the filename to single-no-image.html
6. In theme.json, add your new custom template and name it Single Post no Featured Image so it will have a user-friendly name in the Site Editor
7. Back in the Site Editor, make a new change and point out that it is saved to database
8. Show how this looks in Manage all templates with the template customized by user
9. Using the Create Block Theme plugin choose the Save Changes option (this removes changes from database and saves them to your theme file)
10. Show how this looks different in Manage all templates (with all templates coming from theme not user)
11. Finally, back in the code editor, show how your change is saved to your theme file

[jonathanbossenger]

That sounds great @cynthianorman excellent work.

[cynthianorman]

This Intermediate Theme Developer Learning Pathway Lesson is ready to be reviewed. Please follow the steps listed under Guidelines for reviewing content. Thank you for your contribution! ✨

https://youtu.be/WAkmnyi_NtU (unlisted)

[devmuhib009]

Tutorial/Lessons Review Checklist

Please tick all items you've confirmed:

• Learning outcomes/objectives are clear.
• Technical concepts introduced in the content are accurate.
• The speed of demonstrations are easy to follow.
• The narration audio matches what is shown visually.
• Spelling and grammar are correct.
• Sound quality is consistent throughout the video.
• Brand Usage Guidelines and Promotional Guidelines are being followed.
• Media assets are all in the public domain (CC0).

[cynthianorman]

@devmuhib009 Thank you so much for taking the time to review Muhibul!

[jonathanbossenger]

https://wordpress.tv/2024/05/23/global-settings-and-styles-custom-templates/

[jonathanbossenger]

https://youtu.be/sNdN5VJZQJ0

[cynthianorman]

@jonathanbossenger

YouTube Chapters

(0:06) Learning objectives
(0:28) Creating a custom template
(1:09) Registering custom templates in theme.json
(2:15) Using Create Block Theme plugin to update theme files
(4:14) Next steps

[jonathanbossenger]

https://learn.wordpress.org/lesson/custom-templates/

[jonathanbossenger]

//publish