$wp_styles->registered not giving ALL the styles?

by

I’m pretty new to WordPress programming (been using it for a while, but never got into the nitty gritty). So, I’m trying to “minify” some JS/CSS files into common ones. I’m manually joining the files into common.css and common.js – thats not an issue (I need to do it that way, to fix ../ etc stuff in the JS/CSS files)

So – after a lot of playing around I’m still stumped. I tried:

$wp_styles->queue

but all that does is print out one file (even using print_r)

I then found this feature:

$wp_styles->registered

which after a bit of playing, I came out with:

foreach ($wp_styles->registered as $val) {
     echo "CSS: " . $val->handle . " at " . $val->src . " \n";
}

So, that works… BUT, and here is the but… it doesn’t have everything in! 

<?php
/*
Plugin Name: X Cleanup
Description: Removes unneeded and unwanted stylesheets from other plugins
Version: 0.1
*/

//Use a class to avoid conflicts
class my_load_reducer {
    function __construct() {
        //Hook into wp_enqueue_scripts with a high priority
        add_action( 'wp_loaded', array($this, 'deregister_styles'),99999);
    }
    function deregister_styles() {

        global $wp_scripts;
        global $wp_styles;

        foreach ($wp_scripts->registered as $val) {
            echo "JS: " . $val->handle . " at " . $val->src . " \n";
        }

        foreach ($wp_styles->registered as $val) {
            echo "CSS: " . $val->handle . " at " . $val->src . " \n";
        }

    }
}

//Instantiate the class
$my_load_reducer = new my_load_reducer();

From my understanding, the wp_loaded hook should be one of the last to run (before its printed out, and after all the plugins have run)

So… whys it not got everything in? I’m stumped!

TIA

UPDATE: As suggested, I tried using the wp_enqueue_scripts action:

add_action( 'wp_enqueue_scripts', array($this, 'deregister_styles'),99999);

I then run the page, and see my debug for the CSS files as:

CSS: colors at 1 
CSS: wp-admin at /wp-admin/css/wp-admin.min.css 
CSS: login at /wp-admin/css/login.min.css 
CSS: install at /wp-admin/css/install.min.css 
CSS: wp-color-picker at /wp-admin/css/color-picker.min.css 
CSS: customize-controls at /wp-admin/css/customize-controls.min.css 
CSS: customize-widgets at /wp-admin/css/customize-widgets.min.css 
CSS: press-this at /wp-admin/css/press-this.min.css 
CSS: ie at /wp-admin/css/ie.min.css 
CSS: buttons at /wp-includes/css/buttons.min.css 
CSS: dashicons at /wp-includes/css/dashicons.min.css 
CSS: open-sans at //fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=latin,latin-ext 
CSS: admin-bar at /wp-includes/css/admin-bar.min.css 
CSS: wp-auth-check at /wp-includes/css/wp-auth-check.min.css 
CSS: editor-buttons at /wp-includes/css/editor.min.css 
CSS: media-views at /wp-includes/css/media-views.min.css 
CSS: wp-pointer at /wp-includes/css/wp-pointer.min.css 
CSS: imgareaselect at /wp-includes/js/imgareaselect/imgareaselect.css 
CSS: wp-jquery-ui-dialog at /wp-includes/css/jquery-ui-dialog.min.css 
CSS: mediaelement at /wp-includes/js/mediaelement/mediaelementplayer.min.css 
CSS: wp-mediaelement at /wp-includes/js/mediaelement/wp-mediaelement.css 
CSS: thickbox at /wp-includes/js/thickbox/thickbox.css 
CSS: media at /wp-admin/css/deprecated-media.min.css 
CSS: farbtastic at /wp-admin/css/farbtastic.css 
CSS: jcrop at /wp-includes/js/jcrop/jquery.Jcrop.min.css 
CSS: colors-fresh at  
CSS: login-with-ajax at http://steampunk-reviews.com/wp-content/themes/valenti/plugins/login-with-ajax/widget.css 
CSS: grunion.css at http://steampunk-reviews.com/wp-content/plugins/jetpack/modules/contact-form/css/grunion.css 
CSS: genericons at http://steampunk-reviews.com/wp-content/plugins/jetpack/_inc/genericons/genericons/genericons.css 
CSS: jetpack-icons at http://steampunk-reviews.com/wp-content/plugins/jetpack/css/jetpack-icons.min.css 
CSS: omnisearch-admin at http://steampunk-reviews.com/wp-content/plugins/jetpack/modules/omnisearch/omnisearch.min.css 
CSS: jquery-ui at http://steampunk-reviews.com/wp-content/plugins/contact-form-builder/css/jquery-ui-1.10.3.custom.css 
CSS: contact_form_maker_frontend at http://steampunk-reviews.com/wp-content/plugins/contact-form-builder/css/contact_form_maker_frontend.css 
CSS: cb-main-stylesheet at http://steampunk-reviews.com/wp-content/themes/valenti/library/css/style.css 
CSS: cb-font-stylesheet at //fonts.googleapis.com/css?family=Oswald:400,700,400italic|Open+Sans:400,700,400italic&subset=greek,greek-ext 
CSS: fontawesome at http://steampunk-reviews.com/wp-content/themes/valenti/library/css/fontawesome/css/font-awesome.min.css 
CSS: cb-ie-only at http://steampunk-reviews.com/wp-content/themes/valenti/library/css/ie.css

..yet still no mention of this one :/

<link rel="stylesheet" id='maxgalleria-image-tiles-css'  href="http://steampunk-reviews.com/wp-content/plugins/maxgalleria/addons/templates/image-tiles/image-tiles.css?ver=4.2.2" type="text/css" media="all" />

So still doesn’t seem to be running at the end, as I was hoping 🙁

1 Answer
1

All scripts and styles which get included by either wp_enqueue_script() or wp_enqueue_style() get displayed in the action hook wp_head or wp_footer. So the proper moment to merge them together would be there. Hook in very early and do your magic there.

The wp_enqueue_styles hook is not necessarily the best one, since it is not always the hook where the styles are registered. So it seems to me, it would be better to merge the scripts/styles at the moment of the output, not the input.

Leave a Comment