【WordPress】JavaScriptやCSSを削除する際などに使うハンドル名の確認方法

WordPressでは、プラグインなどのJavaScriptやCSSを削除したい際などに、スクリプトやスタイルシートのハンドル名が必要となります。今回は、そのハンドル名を確認するソースコードの例です。

スクリプトやスタイルシートを削除する方法は、以下のリンク先を参考にしてみてください。

【WordPress】CSS・JavaScriptの外部ファイルを追加・削除する方法｜wp_enqueue_scripts

スクリプト・スタイルシートのハンドル名を表示する例

今回の例では、参照しているスクリプト・スタイルシートのハンドル名を、HTMLのソースコードに表示して確認します。以下がソースコードとなりfunctions.phpに記述します。

// ハンドル名と、そのファイルの場所を出力させる関数
function my_get_dependency( $dep ) {
	$output = 
		"【ハンドル名】$dep->handle \n" . 
		"【ファイルの場所】'$dep->src' \n";
	return "$output\n";
}

function my_wp_head() {
	// WP_Stylesオブジェクト($wp_styles)を使用しスタイルシートの情報を取得
	global $wp_styles;
	echo "\n<!--\n＜＜スタイルシートのハンドル名＞＞\n";
	foreach ( $wp_styles->queue as $val ) {
		echo my_get_dependency( $wp_styles->registered[ $val ] );
	}
    
	// WP_Scriptsオブジェクト($wp_scripts)を使用しスクリプトの情報を取得
	global $wp_scripts;
	echo "＜＜スクリプトのハンドル名＞＞\n";
	foreach ( $wp_scripts->queue as $val ) {
		echo my_get_dependency( $wp_scripts->registered[ $val ] );
	}
	echo "-->\n";
}
add_action( 'wp_head', 'my_wp_head' );

ソースコードの説明

「ハンドル名」と「ファイルの場所」を出力させる関数を定義

まずは、ソースコード2行目からの箇所で、「ハンドル名」と「ファイルの場所」を出力させる関数をmy_get_dependencyという関数名で作成します。

定義したmy_get_dependency関数は、フィルターフックwp_headに登録した関数内で使用し「ハンドル名」と「ファイルの場所」を取得し出力します。

フックwp_headを使用し、HTMLソースに出力

次に、アクションフックwp_headを使用し、「ハンドル名」と「ファイルの場所」をHTMLソースのhead要素内に出力します。今回の例では、ソースコード9行目からの箇所となります。

フィルターフックwp_headのコールバック関数内では、スタイルシートとスクリプトの情報を取得し、定義したmy_get_dependency関数の引数に指定します。それにより、「ハンドル名」と「ファイルの場所」を出力させます。

スタイルシートとスクリプトの情報は、それぞれ、WP_Stylesオブジェクト($wp_styles)と、WP_Scriptsオブジェクト($wp_scripts)を使用し取得しています。