カイカブログ

フリーランスデザイナー カイカデザインのブログ
デザイン、html、wordpress等についてほとんど役に立たない単なる感想レベルのたわごとを綴っています

プラグイン関連のcssファイルをheadから移動、削除したい【サイト軽量化&高速化計画】

この【サイト軽量化&高速化計画】シリーズもついに完結・・・できるか??
さて、最後の難関。プラグインで勝手に挿入されるcssをheadから移動or削除する方法です。

たくさんのcssファイルが存在するのはSEO上よろしくないのと個人的にも好きではない。
ので、以下の条件の場合はstyle.cssに内容をコピーして、プラグイン由来のcssは削除する方向で
進めます。

⚫︎プラグインの更新が見込まれない(笑)
⚫︎プラグインのcssの記述が少ない(少ない方がラクだしw)
⚫︎プラグインのcssで必要部分のみを精査してコピーしたい場合

というわけで私の場合、ブログで読み込ませているcssにプラグインcssの記述を移しました。
(トップページには関係のないプラグインのcssだったので)

とりあえず消したいcssはこちら

⚫︎contact-form7のcss
⚫︎Syntax Highlighterのcss

このSyntax Highlighterのcssが3つくらいあって邪魔w
function.phpに以下の記述を書き込みます。
◼︎function.php

//remove cssfile
function my_deregister_styles() {
	wp_deregister_style( 'contact-form-7' );
	wp_dequeue_style( 'crayon-theme-classic' );
	wp_dequeue_style( 'crayon' );
	wp_dequeue_style( 'crayon-font-monaco' );
	}
add_action( 'wp_print_styles', 'my_deregister_styles', 100 );

さらっと(?)書いてますが、お約束通りここにたどり着くまでが長かった・・・w
試行錯誤しまくった挙句記憶が混乱し、ブログにどう書けばいいのかわからなくなったことも
(それはいつもか?w)

何にてこずったかって、cssのID。
jsの時にも書いたかもしれないけど、このIDが実際のソースに表示されているものと上記に
書いたものが一致していないものがあるんです^^;
特にcssの場合実際のソースでは”crayon-font-monaco-css”となっているのに上記では”crayon-font-monaco”でないと効きませんorz
頼むからIDは統一してほしいw

とりあえずcssの読み込みタグはこれで消えました!

ついでにおまけですが半年前ほどから勝手に挿入される”open-sans”の謎のcss。ほんと謎!
こいつもいらないので以下記述をfunction.phpに書き込んであります。

◼︎function.php

// オリジナル wp_default_styles() in wp-includes/script-loader.php
// Remove Open Sans that WP adds from frontend
if (!function_exists('remove_wp_open_sans')) :
    function remove_wp_open_sans() {
        wp_deregister_style( 'open-sans' );
        wp_register_style( 'open-sans', false );
    }
    add_action( 'wp_enqueue_scripts', 'remove_wp_open_sans');

    // Uncomment below to remove from admin
    // add_action('admin_enqueue_scripts', 'remove_wp_open_sans');
endif;

なんなんでしょうね、このopen-sans。。消し去るというより、隠す感じです。

これでひとまずこのシリーズも完結、、なんですが色々アップデートされたりしていると
すぐに「このファイルが読み込みの邪魔をしている」とかspeed Insightsからツッコミをくらったり
するので、常に何かが邪魔というマッチポンプwww

しかしこのシリーズを通して、htmlの下方にjsを書き込むというクセがつきました。

Leave a Reply

メールアドレスが公開されることはありません。