WordPress Development Quick Start Guide

Build beautiful and dynamic websites for your domain from scratch

Rakhitha Nimesh Ratnayake

• Publisher: Packt Publishing
• Year: 2018
• ISBN:
  9781789342581
• Edition: 1
• Topic: Informatique
• Subtopic: Programmation en PHP

Learn core WordPress concepts and components to create modern WordPress-based solutions

Key Features

• Learn the foundations of WordPress development and its hook-based architecture
• Choose the right components for any development task
• Build flexible solutions that works with existing plugins and themes

Book Description

WordPress is the most used CMS in the world and is the ideal way to share your knowledge with a large audience or build a profitable business. Getting started with WordPress development has often been a challenge for novice developers, and this book will help you find your way.

This book explains the components used in WordPress development, when and where to use them, and why you should be using each component in specific scenarios. You begin by learning the basic development setup and coding standards of WordPress. Then you move into the most important aspects of the theme and plugin development process. Here you will also learn how themes and plugins fit into the website while learning about a range of techniques for extending themes and plugins.

With the basics covered, we explore many of the APIs provided by WordPress and how we can leverage them to build rapid solutions. Next, we move on to look at the techniques for capturing, processing, and displaying user data when integrating third-party components into the site design.

Finally, you will learn how to test and deploy your work with secure and maintainable code, while providing the best performance for end users.

What you will learn

• Explore the role of themes, plugins, and built-in features in development
• Adapt to built-in modules and built-in database structures
• Write code for WordPress's hook-based architecture
• Build, customize, and integrate WordPress plugins
• Extend themes with custom design templates
• Capture and process data with built-in features and custom forms
• Improve usability with AJAX and third-party components
• Manage non-functional aspects, such as security, performance, and migration

Who this book is for

This book is for web developers and site owners who want to build custom websites with WordPress. Basic knowledge of PHP, JavaScript, HTML and CSS is required to get most out of this book.

Extending Plugins with Addons, Filters, and Actions

uilding sites with WordPress involves using existing plugins or creating your own plugins. You should be able to extend existing plugins with new features as well as make your plugins extendable for other developers. We use addons to extend the functionality of a core plugin. So, it's important to keep your plugins extendable so that you can later use addons to add or remove functionality. On the other hand, using and customizing existing plugins with addons allows you to provide low-cost and quality solutions. So, you need to master the techniques of building addons for customizing plugin features as well as integrating multiple plugins.

In this chapter, we explain the importance of addons while following the step-by-step guide to creating an addon for a plugin. WordPress uses a hook-based architecture and hence the built-in hooks are executed in a predefined sequence. We look at the proper execution of these hooks to prevent unnecessary conflicts. Then, we move into customization techniques for plugins while learning the advance uses of script loading and built-in AJAX features. We will be developing a product files addon for WooCommerce, in order to practically experience the customization process. Finally, we integrate the WooCommerce, MyCred, and BuddyPress plugins to learn the best practices of plugin integrations and their limitations.

In this chapter, we will cover the following topics:

• Introduction to addons development
• Creating a basic addon for the post attachments plugin
• Understanding the WordPress core action execution process
• Customizing third-party plugins
• Identifying techniques for integrating plugins
• Integrating multiple plugins for continuous workflow

By the end of this chapter, you will have the ability to customize third-party plugins using different techniques, and integrate multiple plugins to build a continuous workflow for your site.

Technical Requirements

You will be required to have WordPress 4.9.8 installed to follow this procedure. Even if you
have a later version of WordPress, the described examples should work with no significant problems.

The code files of this chapter can be found on GitHub:
https://github.com/PacktPublishing/WordPress-Development-Quick-Start-Guide/tree/master/Chapter05

Check out the following video to see the code in action:
http://bit.ly/2Q8LtBa

Introduction to addons

In general terms, addons are components that change the behavior of a core component. As a developer, you might be familiar with using browser extensions to support development tasks. In such a scenario, the web browser acts as the core component and the extensions act as the addons that install on top of the web browser. The addons in WordPress follows the same concept. However, WordPress addons itself are plugins that change the behavior of a main plugin. Unlike browser extensions, addons in WordPress don't install on top of a plugin. Instead, they act as separate addon plugins.

Usually, addons are used to add new features to the core component. However, WordPress addons are developed to add, change, or remove features of a core component. Let's take a look at some of the popular plugins with a large addons base:

• WooCommerce: This is an eCommerce plugin that allows you to sell physical goods as well as digital products. This plugin has an extensive addons base of over 250 addons in various categories. Payment gateways are the most popular type of addon in WooCommerce with over 75 addons. You can view and learn more about the addons base at https://woocommerce.com/product-category/woocommerce-extensions/.
• Easy Digital Downloads: This is an eCommerce solution allowing you to sell digital products. This plugin also offers over 100 addons while many of them fall into the marketing category. You can learn more about the addons base at https://easydigitaldownloads.com/downloads/.
• WP Bakery Page Builder: This is a plugin used for building page using pre-built components. Both WooCommerce and Easy Digital Downloads are free plugins in the WordPress plugin directory. However, this is a premium-only plugin with over 250 addons in various categories. The UI elements is the most popular addon category for this plugin. You can view and learn more about the addons base at https://wpbakery.com/addons/.

hese are some of the plugins with a large addons base. The existence of addons means that the plugin is coded with necessary hooks for future extension. You can check more popular free and premium plugins to check the availability of addons. Also, you should check the role of each addon and how it interacts with the main plugin. Once you explore different types of addons, you will understand the types of hooks needed in development and how to add them to keep the code open for extension.

Creating addons for plugins

The process of creating addons is similar to the process we used for plugins. However, the possibility of creating an addon depends on the quality of the code in the core plugin. The core plugin should either provide an API to build addons or necessary hooks for extension. As many plugins don't contain a separate API, most addons are built by using the existing hooks. Let's see how we can create an addon for the post attachments plugin created in the previous chapter. Assume that we have the following requirements to be developed as an addon:

• Restrict attachment file types based on default WordPress user roles. Let's provide PDF file access only for non-subscriber members and all other file types to all users in the site.
• Download counter for attachments. We have to count the number of downloads for all attachments of a post, separately for guest users and logged-in users.

In order to implement such requirements without touching the core plugin files, we need to check the availability of any hooks within the plugin. Unfortunately, we don't have any hooks within the plugin, as it was not planned for future extension. So, we have to make the plugin extendable, by adding the necessary hooks.

Adding a filter hook for restricting attachments

Implementing attachment restrictions requires us to conditionally check the user permissions and hide the attachment for unauthorized users. So, we need a filter that can modify the output of attachments in list. Let's add a filter to the file list code inside wpqpa_file_attachment_list. We need to replace the following code:

$display .= '
 <div class="wpqpa-file-item" id="PF'.$file_row->id.'" data-file-id="'.$file_row->id.'" >
 <div class="wpqpa-file-item-row" >
 <div class="wpqpa-file-item-name wpqpa-files-list-name" >'.$file_row->file_name.'</div>
 <div class="wpqpa-file-item-download" ><a href="'.$url.'" >'.__("Download","wpqpa").'</a></div>
 <div class="wpqpa-clear"></div>
 </div>
 <div class="wpqpa-clear"></div>
 </div>';

First, you should remove the preceding code and add the following code to the same location:

$file_display = '
 <div class="wpqpa-file-item" id="PF'.$file_row->id.'" data-file-id="'.$file_row->id.'" >
 <div class="wpqpa-file-item-row" >
 <div class="wpqpa-file-item-name wpqpa-files-list-name" >'.$file_row->file_name.'</div>
 <div class="wpqpa-file-item-download" ><a href="'.$url.'" >'.__("Download","wpqpa").'</a> </div>
 <div class="wpqpa-clear"></div>
 </div>
 <div class="wpqpa-clear"></div>
 </div>';

$file_display = apply_filters('wpqpa_post_attachment_list_item', $file_display, $file_row);
$display .= $file_display;

Instead of directly adding each file HTML code to the $display variable, we use a custom filter called wpqpa_post_attachment_list_item with file details passed as a parameter. This filter allows us to modify the HTML for each file before it's delivered to the browser.

Adding an action hook for counting downloads

In the preceding section, we looked at the process of using filter hooks to extend plugins. We can also use action hooks to extend plugins through addons. The process of counting downloads should be initialized just after the user clicks the Download link and before the file download popup is shown on the browser. So, we need an action hook within those two events. Let's modify the wpqpa_file_attachment_download function to include a new action, as shown in the following code:

$file_mime_type = mime_content_type( $file_dir );
if( $file_mime_type != '' ){ 
 do_action('wpqpa_before_download_post_attachment',$attachments[0]); 
 header( 'Cache-Control: public' );
 header( 'Content-Description: File Transfer' );

The highlighted line shows the modifications added to the existing code. This action allows us to implement additional features before the file is sent to the browser as a download. Now, we have the necessary hooks to create the addon and implement the features.

Creating the attachments addon

As usual, we have to start by creating a plugin directory with a main plugin file, and inserting the header comments to define it as a plugin. We are not going to repeat the code in this section. You can find a directory and files for attachments addon inside the wpquick-attachments-addon directory in source codes. We are going to start the development by restricting the PDF files to users with a subscriber role. Let's implement the wpqpa_post_attachment_list_item filter we added in the previous section:

add_filter( 'wpqpa_post_attachment_list_item', 'wpqaa_post_attachment_list_item' , 10 ,2 );
function wpqaa_post_attachment_list_item( $display, $file_data ){
 $upload_dir = wp_upload_dir();
 $file_dir = $upload_dir['basedir'] . $file_data->file_path;
 $file_mime_type = mime_content_type( $file_dir );

 if($file_mime_type == 'application/pdf'){
 if( !is_user_logged_in() || ( is_user_logged_in() && current_user_can('subscriber') ) ){
 $display = '';
 }
 }
 return $display;
}

Here's what this code does:

1. The callback function has two parameters, with the first one being the HTML for displaying the file link and the second one being the details about the file from database.
2. First, we construct the path of the file by using the WordPress wp_upload_dir function and file path captured from our custom table.
3. Then, we use the PHP mime_content_type function to get the MIME type of the attachment.

4. Next, we filter the files with the MIME type for PDF.
5. Then, we use the condition to check whether the file should be displayed to the user. The first part of the condition checks if we are logged into the site, as the file needs to be restricted for guest users. The second part of the condition checks if the user is logged in as a subscriber.
6. We restrict the file by emptying the content when one of these conditions is met.

Now, we have implemented one of the addon features using a filter hook. Next, we can implement our second requirement for counting downl...