Some people make health a focus of their New Years Resolutions–not that being healthy shouldn’t be on a persons mind, but I like to use the New Year as a way to clean out the cobwebs of development. To think over the past year and decide what processes worked and didn’t and then wipe away those that failed.
I usually start by cleaning out my git repos and local development. I like to think about any frameworks/libraries that I didn’t fully use over the past year and evaluate their worth. Some may have been used others are kicked to the curb. Now that I have a cleaned up development environment I like to see what new open source frameworks/libraries I could benefit from. 2015 was defiantly the year companies open sourced their code.
Its beneficial to create reusable code in projects so future projects can be more efficient. Over time we have created some open source development resources that you can add to your development tool belt. The list below contains plugins, frameworks and libraries that you can get from the WDS Github or WordPress plugin repo.
WDS Image Class
WDS Image Class library can be used in your theme template files to get an image whether it be a featured image, the first image in the post, or a placeholder. This is a no brainer addition all theme developers can use when dealing with a featured image that may not exist yet. Pass arguments to a template tag couldn’t be simpler.
// Default arguments.
$args = array(
'size' => $this->default_size_of_image,
'post_id' => get_the_ID() ? get_the_ID() : get_queried_object_id(), // Use the post id if in the loop.
'attachment_id' => false,
'placeholder' => $this->get_image_placeholder_uri( array(
'size' => $this->default_size_placeholder // Uses the full size or the set placeholder size.
) ),
'include_meta' => false, // Don't include meta (makes it an Array).
'meta_key' => '', // Get the image from a post meta key.
'pb_meta_data' => array(), // Get the image from a Page Builder meta field.
'default' => false, // Allow one method for getting the image override others that might also exist.
);
wds_get_attachment_uri_or_placeholder_uri( $args );
WP Plugin Generator
There have been many WordPress plugin boiler plates over the years but nothing is as spectacular, edible, mind-blowing as this Yeomen WordPress plugin generator. It creates everything you need to develop a plugin for WordPress in a modern development environment. There is a growing list of sub generators making it even more delicious! Use it once and you’ll stop ingesting the add-plugin-files-manually buffet! To set it up only requires a few command lines. The generator will step you through asking for plugin configuration info. After the plugin is created, you can use some of the sub generators to add options pages, widgets, unit testing or even WP-API endpoints. A side benefit of using something like a generator especially in team development is all code comes from the same base and locating assets is fast. We have a few posts on this on this as well–check ’em out!
$ npm install -g yo $ npm install -g generator-plugin-wp //cd into plugins directory $ yo plugin-wp
wd_s
wd_s is a fork of Automatic’s Underscores theme. wd_s has added development goodies to take Underscores from simple parent/child theme to a basis for creating amazing custom websites. You can read about the history of wd_s and how we use it for project scaffolding, too–we use it for most all of our projects! After downloading and installing wd_s, cd into the theme folder and run the install–then you can access grunt tasks.
$ cd /your-project/wordpress/wp-content/themes/your-theme $ npm install && bower install
WDS Simple Page Builder
Simple Page Builder is not a drag and drop page maker like you get with some themes; it’s a library/plugin you can add to your projects to create reusable template parts. We use this extensively in projects and has helped to reuse code/templates in a project or even across projects. Most site design can be broken down into stacked page blocks. SPB can help you create these as reusable blocks instead of one page. After activating the plugin you can place template parts in /your-theme/pagebuilder. Add the template tag below into a page or post template to add any SPB parts you’ve selected in the page admin. Read through the Github documentation there are some granular options. You can also check out this tutorial from Chris on using Simple Page Builder to add unique layouts to your content.
<?php do_action( 'wds_page_builder_load_parts' ); ?>
CMB2
CMB2 is a developer’s toolkit for building metaboxes, custom fields, and forms for WordPress that will blow your mind. That’s the Github description and who could possibly disagree? If you’ve ever had to set up an option/settings page in WordPress then you know how tedious it can be. CMB2 alleviates most of the repetitive work for you and gets you adding meta boxes and fields right away. After adding the plugin or including the library in your project the code snip below would add a meta box and a field. Check the repo for basic examples, and check out the many articles we have covering different ways to utilize CMB2.
function cmb2_sample_metaboxes() {
// Start with an underscore to hide fields from custom fields list
$prefix = '_yourprefix_';
/**
* Initiate the metabox
*/
$cmb = new_cmb2_box( array(
'id' => 'test_metabox',
'title' => __( 'Test Metabox', 'cmb2' ),
'object_types' => array( 'page', ), // Post type
'context' => 'normal',
'priority' => 'high',
'show_names' => true, // Show field names on the left
// 'cmb_styles' => false, // false to disable the CMB stylesheet
// 'closed' => true, // Keep the metabox closed by default
) );
// Regular text field
$cmb->add_field( array(
'name' => __( 'Test Text', 'cmb2' ),
'desc' => __( 'field description (optional)', 'cmb2' ),
'id' => $prefix . 'text',
'type' => 'text',
'show_on_cb' => 'cmb2_hide_if_no_cats', // function should return a bool value
// 'sanitization_cb' => 'my_custom_sanitization', // custom sanitization callback parameter
// 'escape_cb' => 'my_custom_escaping', // custom escaping callback parameter
// 'on_front' => false, // Optionally designate a field to wp-admin only
// 'repeatable' => true,
) );
}
add_action( 'cmb2_admin_init', 'cmb2_sample_metaboxes' );
WDS Required Plugin
I’m sure you’ve come across the conundrum of blocking a plugin deactivation when it has other plugins dependent on it. This library can be added to /mu-plugins and then an array of plugins can be added to keep a plugin from being activated. Keep sanity knowing someone won’t inadvertently white screen a site!
function wds_required_plugins_add( $required ) {
$required = array_merge( $required, array(
'jetpack/jetpack.php',
'sample-plugin/sample-plugin.php',
) );
return $required;
}
add_filter( 'wds_required_plugins', 'wds_required_plugins_add' );
Custom Post Type UI
Creating custom post types can be laborious, but Custom Post Type UI, our most popular plugin, has an admin UI to ease the process. You can add/edit/delete Custom Post Types and Taxonomies. Save significant development time by using this plugin.
WDS Custom Login Page
Activate this plugin and it creates a /login page automatically. But wait there’s more! If you want to create a custom form create a template page-*.php, switch * to the slug of your login page. By default it will be page-login.php. Then add wds_login_form() template tag below to your new template. Easy peezy.
<?php wds_login_form( $redirect, $echo ); ?>
WDS BuddyPress Project Framework
We do a lot of BuddyPress development at WDS. The BuddyPress framework plugin was created to address customizing BuddyPress without editing the BuddyPress core plugin and to streamline the development process. Activate this plugin and it will override the template/assets from the BuddyPress plugin. After activation, run the following command lines to set up the project.
$ cd /your-project/wordpress/wp-content/plugins/wds-bp-project-framework $ npm install && bower install
AppPresser
Want to add mobile app building to your repertoire? AppPresser core plugin is open source. Developers can use this plugin to make custom apps, or custom extensions for AppPresser. This core plugin is a bare bones starting point, so If you are not a developer, check out the AppPresser extensions you can purchase. The core plugin gets you started by adding the Phonegap/cordova files needed to load native device functionality.
That’s ten WebDevStudios development resources to up your game, folks. If you’ve used any of these or have used other must have WordPress open source plugins/frameworks/libraries, add then to a comment below.