Getting Started With WordPress Plugin Development
0 likes2,799 views
The document is a guide to getting started with WordPress plugin development, presented by Thomas Vitale at WordCamp Torino 2017. It covers the basics of plugins, including their structure, execution flow, and examples of creating simple plugins with actions and filters. Additionally, it provides resources for further learning, including links to the WordPress Codex and plugin developer handbook.
Getting Started With WordPress Plugin Development
- 1. GETTING STARTED WITH WORDPRESS PLUGIN DEVELOPMENT Thomas Vitale | thomasvitale.com | @vitalethomas WordCamp Torino 2017 | #wctrn
- 2. 49 479PLUGINS on WordPress.org 2
- 4. WHAT IS A PLUGIN? 1. INTRODUCTION TO PLUGINS 4
- 6. WHY PLUGINS? 1. INTRODUCTION TO PLUGINS 6
- 7. DON’T TOUCH THE CORE! HODOR Game of Thrones @ Home Box Office, Inc. All Rights Reserved. 7
- 9. THE PLUGIN TERRITORY 1. INTRODUCTION TO PLUGINS 9
- 10. THE PLUGIN TERRITORY FUNCTIONS.PHP PLUGINSVS 10
- 11. THE MAIN CONCEPTS 2. PLUGIN BASICS 11
- 12. THE MAIN CONCEPTS THE STRUCTURE 12 /wp-content/plugins/ Icons made by Freepik from www.flaticon.com is licensed by CC 3.0 BY myplugin.php myplugin/
- 13. THE MAIN CONCEPTS THE HEADER (MYPLUGIN.PHP) /** * Plugin Name: My Plugin * Plugin URI: https://thomasvitale.com/myplugin * Description: The awesome plugin for WordPress Community. * Version: 3.9.4 * Author: Thomas Vitale * Author URI: https://thomasvitale.com */ 13
- 16. THE MAIN CONCEPTS WordPress Execution Flow Custom Function 16 Icons from www.vecteezy.com Core
- 17. THE MAIN CONCEPTS WordPress Execution Flow Custom Function 17 Icons from www.vecteezy.com Core
- 19. HOOK
- 26. ACTIONS bob function tom_ciak() { // Print a paragraph echo “<p>And action!</p>”; } add_action( ‘bob’, ‘tom_ciak’ ); 1 2 26 Icons from www.vecteezy.com WordPress Execution Flow
- 27. ACTIONS Function1 Function3 Function2 27 Icons from www.vecteezy.com WordPress Execution Flow bob
- 28. ACTIONS wp_head LoadCSS 28 Icons from www.vecteezy.com WordPress Execution Flow
- 30. FILTERS jack function tom_adv( $content ) { return $content .“Follow me!”; } add_filter( ‘jack’, ‘tom_adv’ ); 1 2 30 Icons from www.vecteezy.com WordPress Flow Execution
- 31. FILTERS the_content Function 31 Icons from www.vecteezy.com WordPress Flow Execution
- 34. AN EXAMPLE TOM BANNER 34 /wp-content/plugins/tom-banner/ Icons made by Freepik from www.flaticon.com is licensed by CC 3.0 BY tom-banner.php css/ style.css
- 35. AN EXAMPLE HEADER (TOM-BANNER.PHP) /** * Plugin Name: Tom Banner * Plugin URI: https://thomasvitale.com/tom-banner * Description: Show a fixed banner to promote your brand new e-book. * Version: 3.9.4 * Author: Thomas Vitale * Author URI: https://thomasvitale.com * License: GPL2 * License URI: https://www.gnu.org/licenses/gpl-2.0.html * Text Domain: thomas * Domain Path: /languages */ 35
- 36. AN EXAMPLE CALLBACK FUNCTION (TOM-BANNER.PHP) function tom_banner_html() { ?> <div class="book-banner"> <p> Do you like reading? <a href="#">Download</a> my new free e-book! </p> </div> <?php } add_action( 'wp_footer', ‘tom_banner_html' ); 36
- 37. AN EXAMPLE STYLESHEET LOADING (TOM-BANNER.PHP) function tom_load_css() { wp_enqueue_style( 'tom-banner', plugins_url( 'css/style.css', __FILE__ ) ); } add_action( 'wp_enqueue_scripts', 'tom_load_css' ); 37
- 38. AN EXAMPLE STYLESHEET (CSS/STYLE.CSS) .book-banner { position: fixed; bottom: 0; left: 0; width: 100%; text-align: center; padding: 10px 0; background: #86151d; min-height: 24px; line-height: 24px; color: #eeeeee; font-size: 1em; } .book-banner p { margin: 0; padding: 5px; } .book-banner a { color: #eee; text-decoration: underline; } 38
- 40. RESOURCES USEFUL RESOURCES ▸ WordPress Codex: https://codex.wordpress.org ▸ Plugin Developer Handbook: https://developer.wordpress.org/plugins/ ▸ Professional WordPress: Design and Development, 3rd edition (Wrox), Brad Williams, David Damstra, Hal Stern ▸ Smashing WordPress: Beyond the Blog, 4th edition, Thord Daniel Hedengren ▸ Codice sorgente plugin d’esempio e altre risorse: https://github.com/ ThomasVitale/GettingStartedWithWordPressPlugins 40
- 41. ARE YOU READY TO DEVELOP YOUR FIRST PLUGIN? Thomas Vitale |@vitalethomas | #wctrn 41 This work is licensed under a Creative Commons Attribution 4.0 International License.