Minifying Custom Widget CSS with W3 Total Cache

Hi SiteOrigin Team!

I have created a simple widgets plugin to extend the site origin widgets bundle.

I’ve followed the hello widget tutorial and have managed to display a simple text widget and offered 3 different colours. It basically uses the same code as the button widget, but instead of ‘atom , flat and wire’ i have used ‘red, blue and green’.

I’ve included three less stylesheets, one for each colour. Everything works as expected.

The only problem i am facing is with the W3 total cache plugin, when i try to minify all the CSS into a single stylesheet, the hello widget styles are separated into different CSS styles including the base CSS file for the text widget. I’ve noticed all the site origin widget styles do get minified into a single file with the style.css file.

Are you guys aware how i can ensure all the CSS for the custom widgets gets minified along with the rest of the CSS into a single CSS file.

I’m guessing the code in question could be this:

	function initialize() {
		$this->register_frontend_styles(
			array(
				array(
					'hello-widget-base',
					'/wp-content/plugins/ss-widgets-bundle/ss-widgets/ss-hello-widget/css/style.css',
					array(),
					SOW_BUNDLE_VERSION
				),
			)
		);
	}


    function get_template_name($instance) {
        return 'base';
    }

    function get_style_name($instance) {
        if(empty($instance['design']['theme'])) return 'red';
		return $instance['design']['theme'];
    }

Cheers,
Paul