Intro to WordPress Plugin Development: Separate Into Multiple Files

We’re nearing the end of the Intro to WordPress Plugin Development series. While we’ve gotten into some more advanced topics in the series, I want to circle back to one of the original concepts. In the best practices section of this series, we talked making your plugin readable to others. This helps if anyone ever needs to read your code to troubleshoot, or even extend your code.

What I want to touch on briefly here is organizing your code into multiple files and folders.

Why separate code into multiple files?

Could you imagine if Google thought it would be a good idea to return every single page on the internet in your search results? I mean, sure the page you’re looking for is in there somewhere, but…where? No one would take the time to search through all that noise to find anything.

Let’s take that same idea and look at your plugin.

So far we’ve included functions in our plugin that:

• Create custom post types
• Creates shortcodes
• Load scripts and styles
• Adds a menu and submenu to the dashboard
• Creates a settings page
• Sanitizes and validates our settings input/output

Now, what if I want to find out how your shortcode works? As we have our plugin now, I have one file that I can go to, which contains a ton of other code. Wouldn’t it be nice if I could go to a file called shortcodes.php to find what I’m looking for?

What if I wanted to troubleshoot the JavaScript code you have running on the admin side of the site? It would be nice to have a folder with all admin files. Even nicer would be to have a subfolder that has all of the JavaScript files that run in the admin.

How to include other files in our plugin

In our main plugin file, we can create a “roadmap” of sorts by including other files as needed. Remember how we conditionally loaded our scripts and styles? Well, we can conditionally load our plugin files as well so that they are only loading on the pages where they are needed.

Here’s an example.

<?php
if( is_admin() ){
    include( 'includes/admin/js/admin-scripts.js' );
}

So, if we use something like that, we’re only going to include the file if we’re on an admin page.

We can get even more specific as well. If we only need the script to load on a certain page, we can even check to see if we’re on that page before including the file.

$screen = get_current_screen();
if( is_admin() && $screen->id == 'toplevel_page_my_page_slug' ){
    include( 'includes/admin/js/admin-scripts.js' );
}

We could even hold off including the file until we are on the file that requires our script. So, for example, if we have a settings page that requires some JavaScript we can load the JavaScript file only on that particular settings page like this:

function sd_display_top_level_menu_page(){
    include( 'admin/js/admin-scripts.js' );
    //the rest of our settings page goes here
}