A major issue in WordPress is the interferences and conflicts between scripts and styles of plugins and themes installed on the site. This is even an open research problem.

A solution to minimize this issue as much as possible is to make sure we only load the script and styles when strictly needed. For the admin pages, WordPress provides the admin_enqueue_scripts hook to be able to check where page are you in before enqueuing anything.

For instance, if you want to make sure a style is only loaded when in the dashboard_page you can write something like:


if($GLOBALS['dashboard_page'] === $hook) {
	wp_enqueue_style( $this->plugin_name . '_dashcss', plugin_dir_url( __FILE__ ) .
                 'css/dashboard/xat_styling.min.css', array(), $this->version, 'all' );
}  

The $hook variable contains the id of the current admin page. The only that remains to be done is to make sure you compare this value with your target page (the admin dashboard in our example). To do so, we store the id of this page when creating it, i.e. when adding the page to the menu.

$GLOBALS['dashboard_page']=add_submenu_page(
	'xatkit-configuration',
	'Dashboard',
	'Dashboard',
	'manage_options',
	'xatkit-dashboard',
	array( $this, 'results_dashboard' )
	);

Featured image by Shawn Ang on Unsplash

Share This