Book Image

WordPress Plugin Development Cookbook - Third Edition

By : Yannick Lefebvre
Book Image

WordPress Plugin Development Cookbook - Third Edition

By: Yannick Lefebvre

Overview of this book

WordPress is one of the most widely used, powerful, and open content management systems (CMSs). Whether you're a site owner trying to find the right extension, a developer who wants to contribute to the community, or a website developer working to fulfill a client's needs, learning how to extend WordPress' capabilities will help you to unleash its full potential. This book will help you become familiar with API functions to create secure plugins with easy-to-use administration interfaces. This third edition contains new recipes and up-to-date code samples, including new chapters on creating custom blocks for the block editor and integrating data from external sources. From one chapter to the next, you’ll learn how to create plugins of varying complexity, ranging from a few lines of code to complex extensions that provide intricate new capabilities. You'll start by using the basic mechanisms provided in WordPress to create plugins, followed by recipes covering how to design administration panels, enhance the post editor with custom fields, store custom data, and even create custom blocks. You'll safely incorporate dynamic elements into web pages using scripting languages, learn how to integrate data from external sources, and build new widgets that users will be able to add to WordPress sidebars and widget areas. By the end of this book, you will be able to create WordPress plugins to perform any task you can imagine.
Table of Contents (15 chapters)

Adding text after each item's content using plugin filters

After making a number of changes to the page header, the generator meta tag, and the site favicon, this recipe takes a more active role by adding a link to each post or page, allowing visitors to email a link to the article that they are currently viewing. This functionality is implemented using a filter hook attached to the page and post content. This allows our custom function to append custom output code to all entries that get displayed on the screen.

How to do it...

Follow these steps to create a plugin that adds an email link at the end of all posts and pages:

  1. Navigate to the WordPress plugins directory of your development installation.
  2. Create a new directory called ch2-email-page-link.
  3. Navigate to this directory and create a new text file called ch2-email-page-link.php.
  4. Open the new file in a code editor and add an appropriate header at the top of the plugin file, naming the plugin Chapter 2 - Email Page Link.
  5. Visit an icon download website, such as https://iconarchive.com, and download an email icon with a small resolution (32 x 32 pixels) in PNG format to the ch2-email-page-link directory, giving it the name mailicon.png.
  6. Add the following line of code at the end of the file to register a function that will be called when WordPress is preparing data to display the content of a post or page:
    add_filter( 'the_content', 
                'ch2epl_email_page_filter' );
  7. Add the following code section to provide an implementation for the ch2epl_email_page_filter function:
    function ch2epl_email_page_filter ( $the_content ) {
        // build url to mail message icon
        $mail_icon_url = plugins_url( 'mailicon.png',
                                      __FILE__ );
        // Set value of $new_content to previous content
        $new_content = $the_content;
        // Append image with mailto link after content, 
        // including the item title and permanent URL
        $new_content .= '<div class="email_link">';
        $new_content .= '<a title="Email article link"';
        $new_content .=
            'href="mailto:[email protected]?';
        $new_content .= 
            'subject=Check out this interesting ';
        $new_content .= 'article entitled ';
        $new_content .= get_the_title();
        $new_content .= '&body=Hi!%0A%0AYou might ';
        $new_content .= 'enjoy this article entitled ';
        $new_content .= get_the_title() . '.%0A%0A';
        $new_content .= get_permalink();
        $new_content .= '%0A%0AEnjoy!">';
        $new_content .= '<img alt="Email icon" src="';
        $new_content .= esc_url( $mail_icon_url );
        $new_content .= '" /></a></div>';
        // Return filtered content for display on the site
        return $new_content;
    }
  8. Save and close the plugin file.
  9. Log in to the administration page of your development WordPress installation.
  10. Click on Plugins in the left-hand navigation menu.
  11. Activate your new plugin.
  12. Visit your website to see the new mail icon at the end of each post and page. You may need to click on an article or page to see the icon:
Figure 2.4 – The newly added Email article link icon

Figure 2.4 – The newly added Email article link icon

  1. Click on one of the mail links:
    Figure 2.5 – The email generated after clicking on the link

Figure 2.5 – The email generated after clicking on the link

As seen in Figure 2.5, your default mail client will come up with information about the item you were reading. The only information that needs to be updated is the recipient address before visitors can quickly send an email.

How it works...

Similar to the previous recipe, this plugin uses the add_filter function to register a custom function to be called by WordPress as it prepares an item's content to be displayed on a page. When the filter function is called, the first action that it performs is to create a URL to the email icon that was downloaded in the recipe. It then goes on to modify the original content by appending the HTML code to display a mailto link. The same technique can be used to create links to popular social media and link sharing sites, with simple changes to the syntax of the link. Once the new content is ready, it is returned to WordPress to be sent to any other registered filters and subsequently displayed on the site.

There's more...

This recipe also introduces a pair of useful WordPress utility functions to get access to the current item's content.

The get_the_title and get_permalink functions

While these two functions are mainly seen within theme template files, they can also be used by plugins to get easy access to the content of items that are currently being processed. More specifically, the two utility functions that are used in this recipe are as follows:

  • get_the_title(): This function gives us quick access to the item's title.
  • get_permalink(): This is a function that returns the item's permalink (a URL that is always associated with this post or page, even after it is no longer featured on a website's front page or blog page).

See also

  • The Creating a plugin file and header recipe
  • The Using WordPress path utility functions to load external files and images recipe
  • The Modifying the site generator meta tag using plugin filters recipe