Now that is a bit of a handful to grab onto … but the code and concept is relatively straight forward and easy to implement.

As I was recently updating some of my plugins in preparation for WordPress 3.3 I decided to better implement the style elements being used in these plugins. The current best-practice methods point to using the `wp_enqueue_scripts` hook with the `wp_enqueue_styles` function. Let’s get our eyes on a snippet for this:

function WPFA_Styles() {
        wp_enqueue_style( 'WPFA-Plugin-Style', plugin_dir_url( __FILE__ ) . 'wpfa-plugin-style.css', array(), '0.1', 'screen' );
}
add_action( 'wp_enqueue_scripts', 'WPFA_Styles' );

We create a function to enqueue our stylesheet; then we use `add_action` to hook into `wp_enqueue_scripts` and we’re done … or are we?

What if we wanted to let the end-user add their own styles to the plugin CSS elements but not have them over-written with the next plugin update? Easy, just add another `wp_enqueue_style` into the `WP_Styles` function like this:

function WPFA_Styles() {
        wp_enqueue_style( 'WPFA-Plugin-Style', plugin_dir_url( __FILE__ ) . 'wpfa-plugin-style.css', array(), '0.1', 'screen' );
        wp_enqueue_style( 'WPFA-Plugin-Custom-Style', plugin_dir_url( __FILE__ ) . 'wpfa-plugin-custom-style.css', array(), '0.1', 'screen' );
}
add_action( 'wp_enqueue_scripts', 'WPFA_Styles' );

This is fine, but what if the custom stylesheet does not exist? Although it will not cause any significant issues there is no reason to actually enqueue a file that does not exist. The solution to this is straight forward as well, just check if the file is available to be used … but how?

Let’s look at the complete example to see where I add the `is_readable` conditional check:

/**
 * Enqueue Plugin Styles
 *
 * Adds plugin stylesheet and allows for additional custom stylesheet to be added by end-user. Custom stylesheet is only enqueued if it is available to be used.
 * 
 * @package     WPFA_Styles
 * @link        http://wpfirstaid.com/2011/11/enqueue-plugin-custom-stylesheet/
 * @version     0.1
 * @author      Edward Caissie <thedoctor@wpfirstaid.com> 
 * @copyright   Copyright (c) 2010-2011, Edward Caissie
 * 
 * @internal    Note: all stylesheets enqueued in this manner are expected to be in the root folder of the plugin.  
 */
function WPFA_Styles() {
        /** Enqueue Style Sheets */
        wp_enqueue_style( 'WPFA-Plugin-Style', plugin_dir_url( __FILE__ ) . 'wpfa-plugin-style.css', array(), '0.1', 'screen' );
        // Only enqueue if available
        if ( is_readable( plugin_dir_path( __FILE__ ) . 'wpfa-plugin-custom-style.css' ) ) {
            wp_enqueue_style( 'WPFA-Plugin-Custom-Style', plugin_dir_url( __FILE__ ) . 'wpfa-plugin-custom-style.css', array(), '0.1', 'screen' );
        }
}
add_action( 'wp_enqueue_scripts', 'WPFA_Styles' );

Note the use of `plugin_dir_path` in the conditional check, this is key as the `is_readable` function requires the path and will not work using the URL.

This may appear as a Mallory-Everest idea, but there have been use-cases where an additional custom stylesheet solved the issues at hand. Hopefully this will be of use to you.

To see the WordPress Codex References click here.To hide the WordPress Codex References click here.

To see the PHP Functions click here.To hide the PHP Functions click here.