How to vet a plugin for add on development

Video:

Without plugins, many projects in WordPress would never have been possible. Almost all developers develop add-ons to modify existing plugins to fit a client’s needs.

But how do we choose vendor plugins to develop add-ons for? What makes a plugin extensible? What makes it reliable?

These are the questions that prompted me to create a checklist for vetting plugins. The checklist starts at presales and goes to code reviewing.

This is the checklist I shared during this talk. I also received a lot of great input from other developers during the talk and was able to improve the checklist as a result.

Checklist for vetting a plugin for add-on development

Before Downloading or Purchasing

  1. Does it have a good support culture?
  2. Does it have add-ons developed by third party developers?
  3. Does it have a strong community?
  4. Do they have clear, easy on the eyes, documentation?
  5. Do they embrace open source?

After Activation: Administrator UX

  1. Does it use the WordPress UI?
    • If not, is the changed UI creating a significantly better UX?
  2. Does it use nags tastefully?
  3. Does it take up minimal space for upsells?
  4. Does it allow for exports of user generated data?
    • Ex: Form submissions.

After Activation: Database Usage

  1. Does it stick to WP’s built-in tables?
  2. If it creates new tables are they absolutely needed?
  3. Does it add just a handful of rows in the wp_options table?
  4. Is everything prefixed?
    • New tables, meta keys, option keys, CPT or Custom taxonomy slugs etc…

After Activation: Performance

  1. Load the site up with a bunch of dummy content. I use WP-CLI, or FakerPress. The dummy content is important because you’ll only be able to see performances issues with content stressing the code.
  2. Use a profiler such as Query Monitor
    • You can use your preferred profiler for this
      Debug bar, blackfire.io. Browser Dev tools for Client side stuff.
  3. Check the Query Monitor output for red.
  4. Check for slow SQL queries, failing HTTP requests, or long running JS scripts.

After Activation: Uninstallation

  1. Does it give you the option to remove it’s data from the DB and Uploads directory? (credit to Brent Jett from the Beaver Builder Team)

Code Review: Clean Code

  1. Is it readable/easy to follow?
  2. Does it follow PHP and WP standards?

Code Review: Can you add Functionality?

  1. Grep do_action and apply_filters Are there a lot of them and are they all well documented in the code with a doc block?
  2. Does it provide a lot of actions?
  3. Does it allow you to filter data before saving?
  4. Does it allow you to filter data before it is output?

Code Review: Can you remove functionality?

  1. Does it use the hook pattern internally?
  2. Are the callbacks it adds to WP accessible?
    • Use Global Vars, static methods or Singletons.
      Bottom Line: Callbacks need to be accessible in some way.

Code Review: ShortCodes

  1. Does it allow you to filter the user input for shortcode attrs?
  2. Does it allow you to filter the allowable shortcode attrs?
  3. Does it allow you to filter shortcode HTML output?

Code Review: Internal API

  1. Does it have an internal API to access core functionality?
    • Check out WooCommerce (pre 3.0).

Code Review: Display Logic

  1. Does it have overridable templates?
  2. Does it enqueue scripts and styles?
  3. Does it use WordPress’ loop logic to output content?

Examples of good plugin design

  1. Gravity Forms- has a ton of filters to change submission data.
  2. WooCommerce- Overridable templates, great internal API.
  3. Beaver Builder- Best overridable Admin templates for module settings pages. Amazing communities of users and add-on developers.
  4. Ninja Forms- Breaks the rule about Admin UI design and greatly improves form creation UX as a result. An amazing community of add-on developers.
  5. Contact Form 7- really beautifully clean code, solid yet minimal plugin design, and amazingly extensible. Is symbolic of open source.
  6. CMB2- Great Developer’s meta box plugin

Slides


Useful Sources

Database Usage

  1. Which tables to use for what data
  2. What are the WP DB tables
  3. Problems with the options table
  4. Meta key best practices
  5. How to use post meta correctly
  6. How post meta gets abused
  7. A profiler for PHP, js, and mysql queries
  8. Versioning options arrays

Clean code

  1. PHP coding standards
  2. WP Coding standards
  3. Code mistakes in plugins
  4. Clean code in plugins
  5. Clean code in plugins
  6. File management in plugins

Can you remove functionality?

  1. Problems with not extensible plugins
  2. Orphan objects
  3. How to instantiate an accessible plugin

Display logic

  1. Overridable templates, filtered shortcodes and more

Admin UI

  1. Why use WP’s built in UI

WPATX Developer Code Share

There is a Developer’s Code Share on Monday, October 5, 2015, 7:00 PM to 8:45 PM. We invite anyone with fun, interesting, or useful code to show your stuff. Post your code in the form below so we can add it to the presentation. Thanks!

  • This field is for validation purposes and should be left unchanged.

The Ultimate WordPress Workflow to Create Web sites of the Future.

The Ultimate WordPress Workflow: Using Browser Sync, Vagrant, and Gulp to create Web sites of the future.

Eli McMakin demonstrated how to automate the install of your WordPress site with a custom Bash script. The bash script will include code that syncs that site to mobile devices and an IE9 Virtual Machine with Browser Sync, for rapid cross-browser testing. There will also be a tutorial on how to sync sites with a Vagrant workflow, for when a team of developers needs to have the same development environment, but still wants to do rapid cross-browser testing.

Eli posted his slides here: http://www.slideshare.net/EliMcMakin/wordpress-workflow-of-the-future

 

What WP Developers Need to Know about Responsive Images

Christopher Schmitt

Christopher Schmitt

This month’s meet-up presented Christopher Schmitt, web design specialist, trainer, CSS3, HTML5, UX, IA consultant, and  author of Designing Web & Mobile Graphics, CSS Cookbook, the HTML5 Cookbook and several other books. He has given talks demonstrating the use and benefits of practical standards-based designs at conferences such as Web Visions and SXSW. In Spring 2009 he co-founded Environments for Humans, through which he chairs both physical (AIGA In Control Web Design Workshop Conference) and online conferences (CSS Summit, jQuery Summit, etc.) geared to Web design professional.

This presentation was a great opportunity to get process tips from one of the best. WP Engine graciously sponsored the Austin WP Dev meetup and provided Pizza and soft drinks for the attendees.

 

 

WordPress Hooks and Filters

Presentation by Nick Batik, @Nick_Batik

Nick’s slides are available at http://presentations.handsonwp.com/category/wordpress-hooks-and-filters/

The WordPress page lifecycle

  • The events from when a web page is requested to when the page is returned to the browser
  • Various information is communicated to and from the server where the website is housed, including a user’s browser and cookie information, and the WP function is called, and the template loader is fired, ending with the page appearing in the browser
  • There are hundreds of files that are called in the construction of a page, and happens every time a visitor clicks on your site, and most happen within fractions of a second.
  • There are points in here where we can effect change.

What are hooks and how do they fit into the page lifecycle?

“Hooks enable us to literally hook into parts of the WordPress page lifecycle to retrieve, insert, or modify data, or they allow us to take certain actions behind the scenes.”

– Tom McFarlin @TUTSPLUS

  • Think of hooks like mailboxes, and you just need to find the correct mailbox to insert information.
  • Almost all of Genesis framework is built around adding and removing things from hooks and filters.
  • Technically, hooks are a description for two different types of things: actions and filters.
  • Action add or modify a sequence of events. Examples: removing comments; create landing page.
  • Filters are used to change data within your site. For example, you can filter that look for comments with profanity, or find and correct misspellings of your company name.

Actions and filters examples

There are actions to perform, add or remove actions from a page.

Action Hooks

  • do_action()
  • add_action()
  • remove_action()
  • has_action()
  • do_action_ref_array()
  • did_action()
  • remove_all_actions()

Using Action Hooks

  • do_action( ‘hook_name’, [$arg] );
  • add_action ( ‘hook_name’, ‘your_function_name’, [priority], [accepted_args] );
  • remove_action( ‘hook_name’, ‘your_function_name’, [$priority], [$accepted_args]);

Filters

  • apply_filters()
  • add_filter()
  • remove_filter()
  • has_filter()
  • current_filter()
  • merge_filters()
  • remove_all_filters()

Using Filters

  • apply_filters( ‘hook_name’, $value, [$var …] );
  • add_filter( ‘hook_name’, ‘function_to_ add’, [$priority], [$accepted_args] );
  • remove_filter( ‘hook_name’, ‘function_ to_remove’, [$priority], [$accepted_args ] );

A simple filter

add_filter(‘the_content’, ‘my_filter_function’, 10);

function my_filter_function($content) {
$output = '<div>'.$content.'</div>';
return $output;
}

More on hooks and filters

  • Hook provide places to either the operation of WordPress or the data it’s working on. Hook names, or tags, are how you identify what you’re going to be working on (the mailboxes). Hooks and actions are designed to modify what is happening in WordPress without having to modify the core installation of WordPress itself.
  • Many themes and plugins add their own hooks and filters to WordPress as well.
  • There’s an array, $wp_filter, that stores tags and associated filter or action functions.

Where can you learn what hooks and filters are out there?

Examples!

Using hooks and filters sometimes comes from trial and error. Whether the results of a hook shows up in the post editor or on the final page depends on how the hook is written.

For those that requested, her is the link to last month’s presentation by Chris Weigman: https://speakerdeck.com/chriswiegman/php-an-introduction-to-the-language-beneath-wordpress

Fun with WP CLI

Add yourself as an admin user
wp user create myusername email@email.com --role=administrator --user_pass='password'

Quickly reset a list of user passwords
wp user list
wp user update user1 user2 --user_pass='password'

Correct URLs after DB migration
wp option update siteurl 'http://domain.com'
wp option update home 'http://domain.com'
wp search-replace 'olddomain.com' 'newdomain.com'

Generate MySQL prompt
wp db cli

Regenerate thumbs
wp media regenerate

Convert to subdomain multisite install
wp core multisite-convert --title='My Network' --subdomains

Update the title for page with slug ‘about’
wp post list --pagename=about
wp post update <post ID> --post_title='New Title'

Update ‘Mood: Happy’ to ‘Mood: Sad’ for the same page, without knowing the name of the field
wp post meta list <post ID>
wp post meta update <post ID> my_mood 'Sad'

Remove unneeded themes
wp theme list
wp theme delete themename1 themename2

Toggle state of plugins ( active / inactive )
wp plugin toggle plugin1 plugin2

Create new empty child theme
wp scaffold child-theme <slug> --parent_theme=<slug> [--theme_name=<title>] [--author=<full-name>] [--author_uri=<uri>] [--theme_uri=<uri>] [--activate]

Ex:
wp scaffold child-theme my-child --parent_theme=genesis --theme_name='My Child' --author='Pat Ramsey' --author_uri=http://testsite.com --theme_uri=http://testsite.com --activate

Vagrant UP

Tonight’s Advanced WordPress Meetup covers the topic of Vagrant. Chris Weigman gave the talk; his slides can be found here.