Unlock your potential with a Pro Membership
Here is where you propel your career forward. Come join us today. Learn more.
Enqueue the Assets
Lab: Let’s Build the Collapsible Content Plugin – Part 1
Video Runtime: 20:35
In this episode, you are going to tie PHP together with your JavaScript. You will deeply learn about enqueuing assets (your script). You’ll add new constants and complete the bootstrap.php and plugin.php files.
Then you and I are going to run our script and explore the click handler. We’ll load the assets into the head and footer to see what happens. We’ll load the minified version and discuss why you want to compress and optimize your scripts.
Here is the plugin’s constants code that will add into your bootstrap file:
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| define( 'COLLAPSIBLE_CONTENT_PLUGIN', __FILE__ ); | |
| define( 'COLLAPSIBLE_CONTENT_DIR', plugin_dir_path( __FILE__ ) ); | |
| $plugin_url = plugin_dir_url( __FILE__ ); | |
| if ( is_ssl() ) { | |
| $plugin_url = str_replace( 'http://', 'https://', $plugin_url ); | |
| } | |
| define( 'COLLAPSIBLE_CONTENT_URL', $plugin_url ); | |
| define( 'COLLAPSIBLE_CONTENT_TEXT_DOMAIN', 'collapsible_content' ); |
When was the last time you got out of your chair and stretched? Just saying…
Episodes
Total Lab Runtime: 04:18:43
- 1 Lab Introductionfree 10:15
- 2 Planning Out the Pluginfree 12:53
- 3 Plugin Architecturepro 12:42
- 4 Plugin Header - Tell WordPress "Hey, I'm a Plugin"pro 09:36
- 5 Add UpGulppro 13:45
- 6 Setup the GitHub Repositorypro 12:04
- 7 Architect the HTML Markuppro 08:47
- 8 Build Q&A HTML Viewpro 13:20
- 9 Build Teaser HTML Viewpro 08:16
- 10 Architect the Shortcodespro 15:05
- 11 Shortcode Runtime Configuration Parameterspro 06:42
- 12 Build the Shortcode Processerpro 11:26
- 13 Autoloadpro 01:45
- 14 Test the Shortcodepro 09:38
- 15 Architect the jQuery Scriptpro 11:47
- 16 Build the jQuery Basic Structurepro 16:21
- 17 Enqueue the Assetspro 20:35
- 18 Passing PHP Values to JavaScriptpro 12:46
- 19 Refactorpro 07:40
- 20 Building the Click Handlerpro 08:48
- 21 Get the Element's Indexpro 08:50
- 22 Is the Hidden Content Showing?pro 04:24
- 23 Animate the Hidden Contentpro 04:06
- 24 Change the Iconpro 12:50
- 25 Commit Changes & Wrappro 04:22
