WordPressで未使用のCSSとJSを削除する方法（非常に簡単）
未使用のCSSがたくさんあると、サイトの速度が低下する可能性があります。 Google PageSpeedインサイトを使用してWebサイトをテストすると、未使用のCSSを削除するように警告が表示される場合があります。 コーディングや技術を使わずにそれを行う簡単な方法があります。
Webサイトに未使用のCSSとJSがたくさんあると、Webサイトの読み込み時間が長くなる可能性があります。 あなたがあなたのウェブサイトを介して実行する場合 速度テストツール など Google PageSpeed インサイト、未使用のCSSを削除するように警告が表示される場合があります。
ありがたいことに、それを行うための非常に簡単な方法があります。 WordPressサイトから未使用のCSSとJSを削除するために、特別な技術的知識は必要ありません。
これは驚くべきことによるものです プラグイン として知られている アセットクリーンアップ：ページスピードブースター。 このプラグインを使用すると、いくつかのボタンをクリックするのと同じくらい簡単に未使用のCSSを削除できます。 または、XNUMX年に数ドルを費やしてもかまわない場合は、 WP Rocket、削除された未使用のCSSボタンがあります。これをアクティブにするだけで、プラグインはすべての未使用のCSSを自動的に削除します。
チェックアウト： トップ7マネージドGoogleCloudWordPressホスティング
未使用のCSSとは何ですか？
未使用のCSSは、ページに存在するCSSファイルですが、ページをロードするためにほとんど必要ありません。 訪問者がWebサイトを開くと、ブラウザは通常、訪問者にページコンテンツを表示する前に、訪問したページのすべての外部スタイルシートをダウンロード、解析、および処理する必要があります。 そのページで使用されていないCSSがそのようなページに存在する場合、ブラウザはそのページで時間を無駄にします。
この典型的な例は、使用されているほとんどの連絡フォームプラグインです。 これらのプラグインは主に「お問い合わせ」ページでのみ使用されますが、Webサイト全体にCSSをロードします。 使用されていないホームページでも構いませんが、CSSが読み込まれます。
必要のないCSSが多すぎるが、ブラウザの読み込みとページの読み取りと表示に時間がかかる場合は、問題になる可能性があります。
プラグインとは別に、テーマ開発者は、ほとんど必要とされない多くのことをstyle.cssに書き込みます。 ただし、必要かどうかに関係なく、サイトが読み込まれるたびに読み込まれます。
XNUMXつの未使用のCSSは問題ではないかもしれませんが、多くの未使用のCSSはWebサイトの読み込み時間に影響を与える可能性があります。
チェックアウト： 最速で最高のWordPressテーマトップ10
未使用のCSSを特定する方法
未使用のCSSとJSを見つけるのはとても簡単です。 私がお勧めするXNUMXつのアプローチがあります。
XNUMXつは、GooglePageSpeedInsightを介してWebサイトを分析することです。 Webサイトに未使用のCSSの削除の問題があるかどうかを確認します。 それをクリックすると、それを担当しているサイトのコンポーネントを特定できます。
上から見ると、未使用のCSSがXNUMX件記録されていることがわかります。 これを見れば、未使用のCSSのプラグインと場所がわかります。
XNUMX番目のオプションは、より詳細な分析を取得することです。 これは、Chrome開発ツールを使用して実現できます。
Chromeブラウザーで、Chrome開発ツールを開き、カバレッジに移動します。 次に、カバレッジエリア内のリロードボタンをクリックします。 あなたは見つけることができます GoogleDevelopersツールでこれを行う方法に関する包括的なガイド.
他のオプションは使用することです 未使用のCSSセレクターをスキャンするためのjitbit。 あなたも使用することができます CSSの浄化 未使用のCSSを見つける
未使用のCSSを削除する方法
WordPressから未使用のCSSを削除するには、次の手順に従います。
1.AssetCleanUpをインストールします
プラグインに移動し、新規追加します。 次に、[新しいプラグインの追加]ページの検索ボックスに「AssetCleanUp」と入力します。 プラグインをインストールしてアクティブ化します。
2. プラグインの設定に移動
プラグイン設定にアクセスするには、WordPress dasboardから設定をクリックしてから、AssetCleanUpをクリックします。
3.不要なCSSとJSをアンロードします
プラグインの設定では、開始する前に、ストリッピングファットタップの下でプラグインがどのように機能するかを知っていることを受け入れる必要がある場合があります。
CSSとJSをアンロードするには、CSSとJSSマネージャーをクリックします。 そこから、不要なCSSとJSを削除できます。 ホームページのみ、サイト全体、または特定のURLから削除できます。 投稿、ページ、またはカテゴリを削除することもできます。
例として、お問い合わせページを除くサイト全体の読み込みからお問い合わせフォームをアンロードします。
時間をかけて、不要であることがわかっているすべてのCSSとJSをアンロードします。 完了したら、必ずサイトをテストして、すべてが正常であることを確認してください。
未使用のCSSWordPressプラグインを削除します
WordpPressで未使用のCSSを削除するために使用できるプラグインは次のとおりです。
1.アセットのクリーンアップ：ページスピードブースター
アセットクリーンアップ：ページスピードブースター 初心者でも未使用のCSSやJSinWordPressを簡単に削除できます。 あなたがしなければならないのは、特定のページに必要のない特定のCSSを非アクティブ化することです。
個々の投稿のみを非アクティブ化することもできます。 プレミアムバージョンでは、プラグインによって未使用のCSS/JSを非アクティブ化できます。
このプラグインは、WordPressを高速化するための他の多くのオプションを備えた完全なパフォーマンスプラグインです。 未使用のCSS/JSの削除はその一部にすぎません。
この投稿では、このプラグインにガイドがあります。
2。 WPロケット
WP Rocket ナンバーワンのWordPressプレミアムパフォーマンスプラグインです。 あなたが初心者の場合、つまり、WordPressの経験がない、または慣れていない場合は、WPRocketが未使用のCSSを削除する最も簡単な方法です。
プラグインを購入する必要があります。購入したら、アカウントからダウンロードするか、プラグインを確認してください。 email ダウンロードリンクについては。
[ダッシュボード]>[プラグイン]>[新規追加]>[アップロード]からプラグインをインストールします。
WP Rocket の設定に移動し、「ファイル最適化」タブをクリックします。次に下にスクロールすると、「未使用の CSS を削除」が表示されるので、ボックスにチェックを入れて保存し、キャッシュをクリアします。
3。 Perfmatters
Perfmatters ブライアンジャクソンと彼の兄弟、ブレットジャクソンによって開発されたプレミアムプラグインです。 このプラグインは、未使用のCSSを非常に簡単に削除するのに役立ちます。
まず、プラグインを購入する必要があります。 次に、それをインストールします。 ライセンスをアクティブ化します。 設定に移動するときは、スクリプトマネージャーをオンにします。
Webサイトの任意のページまたは投稿に移動するだけで、ダッシュボードメニューにスクリプトマネージャーアイコンが表示され、それをクリックします。 未使用のCSSとJSをページからまたはグローバルに削除できます。
このプラグインはパフォーマンスプラグインであり、WordPressを高速化するための他の多くのオプションが付属しています。 未使用のCSS/JSの削除はその一部です。
4.CSSJSマネージャー
CSSJSマネージャー 特にモバイルまたはデスクトップからCSSまたはJSを削除できます。 あなたが達成したいことに応じて。
このプラグインは、CSSまたはJSファイルのロードを延期することもできます。
まとめ
未使用のCSSとJSがたくさんある場合は、速度とパフォーマンスのスコアが大幅に向上していることに気付くでしょう。
未使用のCSSをすべて削除することは不可能かもしれませんが、最小限に抑えることができます。 AssetCleanUpを使用して未使用のCSSを削除します ターゲットトレンド.
サイトを次のように見せたい場合を除いて、最適化することを忘れないでください。 世界最速のウェブサイト.
また、お読みください。
関連記事
