Loaders

Barebones loads compiled theme assets through WordPress enqueue functions.

The loader helpers live in includes/loaders.php and are responsible for returning asset URLs, applying file-based versions, and enqueueing the main frontend CSS and JavaScript.

Asset data helper

The bb_get_asset_data() helper returns the URL and version for a file inside the theme. Pass the path relative to the theme root.

PHP
function bb_get_asset_data( $relative_path ) {
    $relative_path = '/' . ltrim( $relative_path, '/' );
    $path = get_stylesheet_directory() . $relative_path;

    return [
        'uri'     => get_stylesheet_directory_uri() . $relative_path,
        'version' => file_exists( $path ) ? (string) filemtime( $path ) : null,
    ];
}
PHP
$style = bb_get_asset_data( '/style.css' );

File-based versioning

Asset versions are based on each file’s modification time.

When a compiled asset changes, its version changes automatically. This helps browsers load the latest file after a rebuild without manually updating a theme version number. If the file does not exist, the version is returned as null.

Frontend stylesheet

Barebones enqueues the main frontend stylesheet from style.css. The stylesheet handle is bb-styles.

PHP
$style = bb_get_asset_data( '/style.css' );

wp_enqueue_style(
    'bb-styles',
    $style['uri'],
    [],
    $style['version']
);

Frontend script

Barebones enqueues the main frontend script from js/scripts.min.js.

The script depends on WordPress-bundled jQuery.

It is loaded in the footer with the defer loading strategy.

PHP
$script = bb_get_asset_data( '/js/scripts.min.js' );

wp_enqueue_script(
    'scripts',
    $script['uri'],
    [ 'jquery' ],
    $script['version'],
    [
        'strategy'  => 'defer',
        'in_footer' => true,
    ]
);

Enqueue hook

The frontend assets are loaded on wp_enqueue_scripts. Use this hook for additional frontend assets that should load across the theme

PHP
add_action( 'wp_enqueue_scripts', 'barebones_enqueue_assets' );

Editor and block assets

Editor and block assets use the same asset data helper, but they are handled outside includes/loaders.php.

Editor styles are enqueued from includes/blocks.php using bb_get_asset_data( '/css/editor-styles.css' ). Block assets are referenced in each block’s block.json file, then versioned through the theme’s style and script loader filters.

Adding other global assets

Add global assets inside barebones_enqueue_assets().

Only add global assets here when they are needed across the theme. Block-specific assets should stay with the block and be referenced from block.json.

PHP
$extra_style = bb_get_asset_data( '/css/example.css' );

wp_enqueue_style(
    'bb-example',
    $extra_style['uri'],
    [ 'bb-styles' ],
    $extra_style['version']
);