(oneechanblog) – WordPressサイトのファイルを縮小しますか？
WordPressのCSSファイルとJavaScriptファイルを縮小すると、ファイルの読み込みが速くなり、WordPressサイトの速度が向上します。
このガイドでは、WordPressでCSS / JavaScriptファイルを簡単に縮小して、パフォーマンスと速度を向上させる方法を紹介します。
ミニファイとは何ですか？いつ必要ですか？
「縮小」という用語は、Webサイトのファイルサイズを小さくする方法を説明するために使用されます。 これは、ソースコードから不要なスペース、行、文字を削除することで実現されます。
通常のCSSコードの例を次に示します。
body
margin:20px;
padding:20px;
color:#333333;
background:#f7f7f7;h1
font-size:32px;
color#222222;
margin-bottom:10px;
コードを縮小すると、次のようになります。
bodymargin:20px;padding:20px;color:#333;background:#f7f7f7
h1font-size:32px;margin-bottom:10px
通常、ユーザーのブラウザに送信されたファイルのみを縮小する必要があります。 これには、HTML、CSS、およびJavaScriptファイルが含まれます。
PHPファイルを縮小することもできますが、縮小してもユーザーのページの読み込み速度は向上しません。 これは、PHPがサーバー側のプログラミング言語であるためです。つまり、訪問者のWebブラウザーに何かが送信される前に、サーバー上で実行されます。
ファイルを縮小する利点は、コンパクトなファイルの読み込みが速くなるため、WordPressの速度とパフォーマンスが向上することです。
ただし、一部の専門家は、ほとんどのWebサイトでパフォーマンスの向上は最小限であり、問題を起こす価値はないと考えています。 ミニファイは、ほとんどのWordPressサイトで数キロバイトのデータのみを削除します。 ウェブ用に画像を最適化することで、ページの読み込み時間をさらに短縮できます。
Google PagespeedまたはGTMetrixエンジンで100/100のスコアを取得しようとしている場合は、CSSとJavaScriptを縮小するとスコアが劇的に向上します。
そうは言っても、WordPressサイトでCSS/JavaScriptを簡単に縮小する方法を見てみましょう。
選択できる3つの異なるオプションを見ていきます。
方法1.WPロケットを使用してWordPressでCSS/JavaScriptを縮小する（推奨）
方法2.SiteGroundを使用してWordPressでCSS/JavaScriptを縮小する
方法3.Autoptimizeを使用してCSS/JavaScriptを縮小します
準備？ 一番お勧めの方法から始めましょう。
方法1.WPRocketを使用してWordPressでCSS/JavaScriptを縮小する
この方法は簡単で、すべてのユーザーに推奨されます。 使用しているWordPressホスティングに関係なく機能します。
まず、WPRocketプラグインをインストールしてアクティブ化する必要があります。 詳細については、WordPressプラグインのインストール方法に関するステップバイステップガイドを参照してください。
WP Rocketは、市場で最高のWordPressキャッシングプラグインです。 WordPressにキャッシュを簡単に追加でき、サイトの速度とページの読み込み時間を大幅に改善します。
詳細については、WordPressでWPRocketをインストールおよび設定する方法に関するガイドを参照してください。
アクティベーション後、アクセスする必要があります 設定»WPロケット [ファイルの最適化]タブに切り替えます。
ここから、CSSファイルの縮小オプションをチェックする必要があります。
WP Rocketは、これがサイトの問題を引き起こす可能性があるという警告を表示します。 先に進み、[最小化CSSを有効にする]ボタンをクリックします。 Webサイトに問題が発生した場合は、いつでもこのオプションを無効にすることができます。
次に、下の[JavaScriptファイル]セクションまでスクロールする必要があります。
ここでは、[JavaScriptファイルを最小化する]オプションの横にあるチェックボックスをオンにします。
繰り返しになりますが、これによりサイトの問題が発生する可能性があるという警告が表示されます。 先に進み、[JavaScriptミニファイを有効にする]ボタンをクリックします。
次に、[変更を保存]ボタンをクリックして設定を保存することを忘れないでください。
WP Rocketは、CSSファイルとJavaScriptファイルの縮小を開始します。 プラグイン設定でキャッシュをクリアして、次のWebサイト訪問者に縮小されたCSSとJavaScriptの使用を開始できるようにすることができます。
方法2.SiteGroundを使用してWordPressでCSS/JavaScriptを縮小する
WordPressホスティングプロバイダーとしてSiteGroundを使用している場合は、SiteGroundOptimizerを使用してCSSファイルを縮小できます。
SiteGround Optimizerは、独自のプラットフォームで動作するパフォーマンス最適化プラグインです。 それはあなたのウェブサイトのロード時間を改善するために彼らのPHPUltrafastとうまく機能します。
WordPressサイトにSiteGroundOptimizerプラグインをインストールしてアクティブ化するだけです。 詳細については、WordPressプラグインのインストール方法に関するステップバイステップガイドを参照してください。
次に、WordPress管理サイドバーのSGオプティマイザーメニューをクリックする必要があります。
これにより、SGオプティマイザーの設定に移動します。
ここから、[その他の最適化]セクションの下にある[フロントエンドに移動]ボタンをクリックする必要があります。
次の画面で、[CSSファイルの最小化]オプションの横にあるスイッチを有効にする必要があります。
次に、[JavaScript]タブに切り替えて、[JavaScriptファイルの縮小]オプションの横にある切り替えを有効にする必要があります。
以上です！ これで、WordPressキャッシュを空にしてサイトにアクセスし、CSSファイルとJSファイルの縮小バージョンを読み込むことができます。
方法3.Autoptimizeを使用してCSS/JavaScriptを縮小します
この方法は、SiteGroundを使用しておらず、WPRocketを使用していないユーザーに推奨されます。
まず、Autoptimizeプラグインをインストールしてアクティブ化する必要があります。 詳細については、WordPressプラグインのインストール方法に関するステップバイステップガイドを参照してください。
アクティベーション後、アクセスする必要があります 設定»自動最適化 プラグイン設定を構成するページ。
ここから、最初にJavaScript設定の「JavaScriptコードの最適化」オプションをチェックする必要があります。
次に、[CSSオプション]まで下にスクロールして、[CSSコードの最適化]オプションの横にあるチェックボックスをオンにする必要があります。
設定を保存するには、[変更を保存]ボタンをクリックすることを忘れないでください。
次に、[空のキャッシュ]ボタンをクリックして、縮小したファイルの使用を開始できます。 このプラグインは、WordPressのレンダリングブロックJavaScriptおよびCSSエラーを修正するためにも使用できます。
この記事がWordPressサイトのCSSとJavaScriptを最小限に抑えるのに役立つことを願っています。 また、WordPressのコアWebサイトを最適化する方法に関するガイドを確認し、究極のWordPressパフォーマンスガイドに従うことをお勧めします。
この記事が気に入った場合は、WordPressビデオチュートリアルのYouTubeチャンネルに登録してください。 あなたはまた私たちを見つけることができます ツイッター とFacebook。
WordPressでCSS/JavaScriptファイルを縮小する方法（3つの方法）の投稿は、WPBeginnerに最初に登場しました。