概要説明
PageSpeed Insightsの対応などでよく使うカスタマイズ。ファーストビューで必要なものだけヘッダーで読み込み、後でゆっくり読み込んでも良い処理はフッターで処理をさせることができるようになります。ファーストビューの表示速度が向上します。
~ 目次 ~
ヘッダーからフッターに移動させる
functions.php
/*---------------------------------------------------- ヘッダーからフッターにCSS読み込みを移動させる ----------------------------------------------------*/ if ( !function_exists( 'move_header_css' ) ){ // ヘッダーのCSSを非表示にする function move_header_css() { wp_dequeue_style('wp-block-library'); // wp_deregister_style('wp-block-library'); } add_action('wp_enqueue_scripts', 'move_header_css'); //フッターで非表示にしたCSSを読み込ませる function move_footer_css(){ wp_enqueue_style('wp-block-library'); // wp_register_style('wp-block-library', '/wp-includes/css/dist/block-library/style.min.css') } add_action('wp_footer', 'move_footer_css'); }
scriptタグも同様の内容で移動が可能
functions.php
/*---------------------------------------------------- ヘッダーからフッターにjavascript読み込みを移動させる ----------------------------------------------------*/ if ( !function_exists( 'move_header_script' ) ){ // ヘッダーのjavascriptを非表示にする function move_header_script() { //wp_dequeue_script('jquery-core'); wp_deregister_script('jquery-core'); } add_action('wp_enqueue_scripts', 'move_header_script'); //フッターで非表示にしたjavascriptを読み込ませる function move_footer_script(){ //wp_enqueue_script('jquery-core'); wp_register_script('jquery-core', '/wp-includes/js/jquery/jquery.js'); } add_action('wp_footer', 'move_footer_script'); }
不要な読み込みを削除したい場合
フッター側の読み込み処理の記述を行わなければ削除だけの対応になります
wp_register_style() と wp_enqueue_style()の違い
wp_register_style() 、wp_enqueue_style() どちらで定義を追加しているかによって解除方法が変わります。消えないなと思ったらどちらか試してみると消えると思います。これで消えない場合はソース内にハードコーディングしている可能性が高いです。