Enqueuing CSS and JavaScript

[jonathanbossenger]

Details

• Content type (Online Workshop, Lesson, Course, Tutorial, or Lesson Plan): Lesson
• Content title: Enqueuing CSS and JavaScript
• Topic description: Introduce the hooks and functions to enqueue CSS or JavaScript in a plugin.
• Audience (User, Developer, Designer, Contributor, etc.): Developer
• Experience Level (Beginner, Intermediate, Advanced, Any): Beginner

Learning Objectives

• Explain why plugins can't just include their CSS or JavaScript in the usual way
• Demonstrate how to enqueue custom CSS or JavaScript
• Describe a method to selectively enqueue CSS or JavaScript on a per post type basis.

Related Resources and Other Notes

• https://developer.wordpress.org/reference/hooks/wp_enqueue_scripts/
• https://developer.wordpress.org/reference/functions/wp_enqueue_style/
• https://developer.wordpress.org/reference/functions/wp_enqueue_script/
• https://developer.wordpress.org/reference/hooks/admin_enqueue_scripts/

Automation Code

//lesson

[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

[jonathanbossenger]

Script: https://github.com/jonathanbossenger/wp-content/blob/main/developer-learning-pathway/06-introduction-to-wordpress-plugins/06-enqueing-css-or-javascript.md

[jonathanbossenger]

Video for review: https://youtu.be/7bUHPRbcDTk

(I've been experiencing GitHub issues due to a local undersea cable outage, so I've uploaded this to YouTube as a private video)

[devmuhib009]

Private video no one can see without access. I think making the video privacy to unlisted can be a good option for reviewers.

[jonathanbossenger]

Thanks @devmuhib009. I'm not used to sharing via YouTube.

I think the GitHub issues have been resolved, so here's the video via GitHub.

06.Enqueuing.CSS.or.JavaScript.mp4

[ironnysh]

Tutorial/Lessons Review Checklist

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

[jonathanbossenger]

Thanks @ironnysh

[jonathanbossenger]

https://wordpress.tv/2024/04/03/enqueuing-css-and-javascript/

[jonathanbossenger]

https://learn.wordpress.org/lesson/enqueuing-css-or-javascript/