Add Action Hook When Enqueueing Scripts for Elements

Feature Requests / Improvements
1

I would like to see an action hook added so that we can enqueue scripts/stylesheets for specific elements. This would allow us to enqueue these files if and only if the element is being used. For example, I like to add a custom javascript file that enhances the functionality of the checkbox filters. Right now, I have to add a conditional to target the specific page(s) or else it gets added across the entire site.

It looks like this would be a very easy thing to do. Something like this…

2

Hi @thekendog ,

As you were trying to enqueue additional script only if a specific JS is enqueued, you should be able to do it like this without an additional hook

add_action( 'wp_print_footer_scripts', function() {

	if ( wp_script_is( 'bricks-filters', 'enqueued' ) ) {
		wp_enqueue_script(
			'my-bricks-filters-extension', // Unique handle for your script
			get_stylesheet_directory_uri() . '/jenn.js', // Path to your custom JS file
			[], // Dependencies
			'1.0.0' // Version
		);
	}

}, 0 );
3

Not every element has a script or stylesheet I could use that for. The filters do, but other elements don’t enqueue anything. I used filters as an example.

Also, it’s not just scripts I want to enqueue. Using the method you mentioned for stylesheets will cause a FOUC.

4

Maybe introduce a new action like
do_action( 'bricks/assets/on_demand_enqueue_asset, $bricks_settings_string ); in assets.php, placed before Font Awesome is enqueued. This would run early enough for developers to access $bricks_settings_string and conditionally enqueue their own assets in the <head> or footer.

The Element API’s enqueue_scripts() method currently only loads assets in the footer.

5

Easiest way without hook would be to extend element itself like this:

class Filter_Checkbox_Extended extends \Bricks\Filter_Checkbox {

    public $scripts = [ 'bricksFilters', 'checkboxExtended' ];

	public function enqueue_scripts() {
		parent::enqueue_scripts();
		wp_enqueue_script( 'filter-checkbox-extended' );
	}

}