Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Advanced WordPress Tooling

31 views

Published on

It used to be that WordPress required a very different toolset than other types of modern PHP apps. Now, however, PHP developers can use many of the same tools to work with WordPress that they would use with Laravel or any other PHP framework.

In this talk, we'll look at how to modernize development of WordPress sites by using Bedrock to give us a modern stack, WP-CLI to interface with WordPress through the command line or even create scripts to run operations, and ways to deploy WordPress that are easier and more stable than FTP. We will also exmplore a myriad of workflow tools to make your WordPress development more stress-free.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Advanced WordPress Tooling

  1. 1. Modern Toolingwith WordPress Keanan Koppenhaver CTO, Alpha Particle keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  2. 2. @kkoppenhaver keanan@alphaparticle.com alphaparticle.com/chiphp
  3. 3. keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  4. 4. keanan@alphaparticle.com AlphaParticle @kkoppenhaver The Good Ol’ Days Shared hosting FTP Deployments Clunkycustom field support Difficultto monitor Small/Medium Blogs
  5. 5. keanan@alphaparticle.com AlphaParticle @kkoppenhaver NewWordPress
  6. 6. How? keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  7. 7. keanan@alphaparticle.com AlphaParticle @kkoppenhaver Case Studies Enterprise levelWordPress (Koppenhaver) Cloud-scale WordPress (AWS) This talk(You’re in the rightplace)
  8. 8. Thoseare high-level overviews Let’s getinto specific tools keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  9. 9. Localenvironment (unheard of in good ol’WordPress) keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  10. 10. keanan@alphaparticle.com AlphaParticle @kkoppenhaver 12 FactorAPp (https://roots.io/twelve-factor-wordpress/) Configsand .envfiles Composer for management
  11. 11. File Structure ├── composer.json ├── config │ ├──application.php │ └── environments │ ├── development.php │ ├── staging.php │ └── production.php ├──vendor └──web ├──app │ ├── mu-plugins │ ├── plugins │ ├── themes │ └── uploads ├──wp-config.php ├── index.php └──wp ├── index.php ├──wp-config.php ├──wp-load.php ├──wp-login.php ├──wp-includes │ ├──A bunch ofWP files ├──wp-admin │ ├──A bunch ofwp files ├──wp-content │ ├── mu-plugins │ ├── plugins │ ├── themes │ └── uploads
  12. 12. keanan@alphaparticle.com AlphaParticle @kkoppenhaver Honorable mentions VaryingVagrantVagrants (VVV) Homestead
  13. 13. DevelopmentWorkflow keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  14. 14. keanan@alphaparticle.com AlphaParticle @kkoppenhaver Better plugin management WPackagist Repository forwp plugins thatcan be pulled in through composer "require": { "wpackagist-plugin/akismet":"dev-trunk", }
  15. 15. Pluginsaren’tjustfor end users keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  16. 16. keanan@alphaparticle.com AlphaParticle @kkoppenhaver Objects to Objects (one of those times notto useWordpress) Butifyou must… Letsyou relate “objects” to “objects”and provides queryinterface for these relations
  17. 17. add_action('init', ‘register_o2o_connection'); /*Assign related galleries toasingle post*/ function register_o2o_connection() { O2O::Register_Connection('post_galleries', 'post', 'gallery',array( 'reciprocal' => true, 'to' => array( 'sortable' => true, 'labels' =>array( 'name' => 'Galleries', 'singular_name' => 'Gallery' ) ), 'from' =>array( 'labels' =>array( 'name' => 'Posts', 'singular_name' => 'Post' ) ) )); }
  18. 18. keanan@alphaparticle.com AlphaParticle @kkoppenhaver Fieldmanager Custom fields…defined in code Helps deployfields throughVCS instead of relying on the DB
  19. 19. add_action( 'fm_post_post', function() { $fm = new Fieldmanager_Group( array( 'name' => 'contact_information', 'children' =>array( 'name' => newFieldmanager_Textfield( 'Name' ), 'phone' => newFieldmanager_Textfield( 'Phone Number' ), 'website' => new Fieldmanager_Link( 'Website' ), ), ) ); $fm->add_meta_box( 'ContactInformation', 'post' ); } );
  20. 20. keanan@alphaparticle.com AlphaParticle @kkoppenhaver QueryMonitor Helps you seewhat’sactuallygoing on Debugs SlowQueries, Load time, Template loading, hooks, transients, and more
  21. 21. keanan@alphaparticle.com AlphaParticle @kkoppenhaver Rewrite Rules Inspector Necessarywhen doing custom URL rewrites Letsyou putinaURLand see the rewrites thatmatched Can flush permalinkfrom inside plugin
  22. 22. Templating Timber letsyou use twig template Eliminates alotofWP ugliness <?php $thumb_id = get_post_thumbnail_id($post->ID); $url=wp_get_attachment_url($thumb_id); ?> <img src="<?php echo $url; ?>" alt="Thumbnailfor <?php echo $post->post_title; ?>" /> <img src=“{{post.thumbnail.src}}" alt="Thumbnailfor Timber" /> keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  23. 23. Wp-cli Command line interface to interactwith Wordpress Mostactions thatcan be undertaken with Wordpress can be done through the command line Wp core update wp plugin install Custom cli commands (migration, scripting, etc) keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  24. 24. Functions.php Splitfunctions.php into multiple parts template-tags.php, media.php, etc Betteryet, if functionalitycan be encapsulated, splititoutinto aplugin Use namespaces to ensureyour functions don’t conflict, because everything is global keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  25. 25. Frontend You can use sass,justenqueueyour compiled css You can use webpackor gulp or npm or whatever Basically, findawayto outputacompiledJS/CSS fileand you can use it keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  26. 26. Frontend (pt2) You can havean entirelydecoupled front-end oraSPAtype of site WP RESTAPI (in core since 4.7) Caveat:Auth is hard Caveat2: Plugins keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  27. 27. Coding standards Usefulwhen workingacrossateam Phpcs andWPCS WPCSactually includes:Wordpress-core,wordpress- docs,Wordpress-extra(WPCORE++),Wordpress-vip Can be hooked up toyour editor to run on save keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  28. 28. And finally… keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  29. 29. Please useversion control keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  30. 30. Version control Some of the bestpracticeswe have covered helpwith this avoid constantfunctions.php merge conflicts Don’tversion controluploads…or plugins (ifyou’re using composer) keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  31. 31. Deployment keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  32. 32. THe firstrule of deploymentis… keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  33. 33. NO FTP (Mostly) keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  34. 34. Deployment Can useanything thathooks intoVCS Trellis (uses bedrockand deploys through Ansible) Deploys should be the leastpainful partofyourworkflow keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  35. 35. Other considerations Php7 Gutenberg/react keanan@alphaparticle.com AlphaParticle @kkoppenhaver
  36. 36. Questions? @kkoppenhaver keanan@alphaparticle.com alphaparticle.com/chiphp

×