Loader That assists with adding styles to a WordPress website.
composer require underpin/loaders/styles
This plugin uses a built-in autoloader, so as long as it is required before Underpin, it should work as-expected.
require_once(__DIR__ . '/underpin-styles/styles.php');
- Install Underpin. See Underpin Docs
- Register new styles as-needed.
A very basic example could look something like this.
underpin()->styles()->add( 'test', [
'src' => 'path/to/style/src',
'name' => 'test',
'description' => 'The description',
] );
Alternatively, you can extend Style
and reference the extended class directly, like so:
underpin()->styles()->add('key','Namespace\To\Class');
To enqueue a styles, run the loader and reference the style ID, like so:
underpin()->style()->enqueue('test'); // Enqueue the test style
In circumstances where you always need to enqueue the style, you can use the provided enqueue middleware.
To enqueue on admin screens:
underpin()->styles()->add( 'test', [
'handle' => 'test',
'src' => 'path/to/style/src',
'name' => 'test',
'description' => 'The description',
'middlewares' => [
'Underpin_Styles\Factories\Enqueue_Admin_Style'
]
] );
To enqueue on the front-end:
underpin()->styles()->add( 'test', [
'handle' => 'test',
'src' => 'path/to/style/src',
'name' => 'test',
'description' => 'The description',
'middlewares' => [
'Underpin_Styles\Factories\Enqueue_Style'
]
] );
To enqueue on both front-end and back-end:
underpin()->styles()->add( 'test', [
'handle' => 'test',
'src' => 'path/to/style/src',
'name' => 'test',
'description' => 'The description',
'middlewares' => [
'Underpin_Styles\Factories\Enqueue_Style',
'Underpin_Styles\Factories\Enqueue_Admin_Style'
]
] );
The middlewares
array uses Underpin::make_class
to create the class instances. This means that you can pass either:
- a string that references an instance of
Style_Middleware
(see example above). - An array of arguments to construct an instance of
Style_Middleware
on-the-fly.
underpin()->styles()->add( 'test', [
'handle' => 'test',
'src' => 'path/to/style/src',
'name' => 'test',
'description' => 'The description',
'middlewares' => [
'Underpin_Styles\Factories\Enqueue_Style', // Will enqueue the style on the front end all the time.
[ // Will instantiate an instance of Style_Middleware_Instance using the provided arguments
'name' => 'Custom setup params',
'description' => 'Sets up custom parameters specific to this style',
'priority' => 10, // Optional. Default 10.
'do_actions_callback' => function ( \Underpin_Styles\Abstracts\Style $loader_item ) {
// Do actions
},
],
],
] );