上書きできて便利なJavaScriptですが、特手のページだけ読み込みさせたい時がありますよね。
そんな時はfunctions.phpをうまく使って条件を付けてあげると良いです。
本記事ではそのやり方を紹介します。
目次
WordPressで特定のページだけJavaScriptを読み込む方法
WordPressで特定のページだけjQueryを読み込む方法は簡単です。
外観 ＞ テーマエディタ ＞ funtions.phpに下記のコードを挿入するだけです。
特定の投稿記事にJavaScriptを読み込む
特定の記事ページを指定した場合は下記のコードを参考にしてください。
function motoki_test_script() {
if (is_single(array('23',35)) {
?>
<script>
document.addEventListener('DOMContentLoaded', () => {
console.log("テストメッセージです: このスクリプトは、特定の記事で実行されています。");
});
</script>
<?php
}
}
add_action('wp_footer', 'motoki_test_script');トップページにJavaScriptを読み込む
トップページにだけJavaScriptを読み込みたい場合は以下になります。
function motoki_test_script() {
if (is_home() || is_front_page()) {
?>
<script>
document.addEventListener('DOMContentLoaded', () => {
console.log("テストメッセージです: このスクリプトは、トップページまたはフロントページで実行されています。");
});
</script>
<?php
}
}
add_action('wp_footer', 'motoki_test_script');
まとめ
できるだけ特定の条件でクラスを追加したい時などはJavaScriptが便利なのですが、高速化も考えると使う記事を限定したいですよね。
そんな場合は条件をつけてピンポイントで読み込むと便利です。
ぜひ参考にしてみてください。
