当サイトではブログ作成にAFFINGER5(アフィンガー)を推奨していますが、実際にAFFINGER5(アフィンガー)を導入した際、どの様なプラグインを入れた方が良いのか。
ぼくが実際に使用しているプラグインを紹介いたします。
Autoptimizeとは
SEO対策としてWordPressのスピード改善が肝になってきますが、そこで活躍するのがAutoptimize。
Autoptimizeは主要なリソースを簡単に軽量化・圧縮してくれるツールです。
Autoptimizeってどんなプラグイン?
Autoptimizeは、CSSやJSなどのリソースを軽量・最適化してくれる無料のプラグインです。
改行やスペースを削除してくれたり、複数のファイルを結合して圧縮してくれたり、これ1つで便利な機能を備えています。
Autoptimizeの導入方法
管理画面のメニュー「プラグイン」>「新規追加」から、「Autoptimize」で検索。「いますぐインストール」をクリックし、有効化します。
管理画面の設定欄に「Autoptimize」が追加されていることを確認し、クリックしてください。
Autoptimizeの使い方と設定方法
JS、CSS & HTMLタブ
以下の2つにチェックを付けてください。
チェックする項目
- JavaScript コードの最適化
- JS ファイルを連結する
CSS オプション
JS、CSS&HTMLタブを選択したまま、下にスクロールすると、CSSオプションの項目に移ります。
ここでは以下の4つにチェックを付けてください。
チェックする項目
- CSSコードを最適化
- CSSファイルを連結する
- インラインのCSSを連結
- すべてのCSSをインライン化
HTML オプション
HTMLオプションでは以下の1つにチェックを付けてください。
チェックする項目
- HTMLコードを最適化
もしコメントをHTMLファイルにそのまま残したい場合は、「HTML コメントを残す」を選択します。
その他オプション
以下の3つにチェックを付けてください。
チェックする項目
- 連結されたスクリプト/CSSを静的ファイルとして保存
- 除外されたCSSファイルとJSファイルを縮小する
- Also optimize for logged in editors/ administrators?
すべての内容に問題なければ、「変更を保存してキャッシュを削除」します。
画像タブ
画像タブについては特に設定する必要はありません。Lazy-load(画像の遅延読み込み)もAutoptimizeで実装できるみたいですが、ぼくは他のプラグインで実装しているので今回はスルーします。
追加タブ
以下の2つにチェックを付けてください。
チェックする項目
- Googleフォント:Googleフォントの削除
- 絵文字を削除
Autoptimizeでリソースを最適化!
これで設定完了です!
無料でここまでできるのはありがたいですね!
-
-
【Autoptimize】WordPressで最初に入れたい無料プラグイン
当サイトではブログ作成にAFFINGER5(アフィンガー)を推奨していますが、実際にAFFINGER5(アフィンガー)を ...
-
-
AFFINGER5とTHE THORを徹底比較!圧倒的な差が出た!?
アフィリエイトに特化したAFFINGER5(アフィンガー)とSEOに特化したTHE THOR(ザ・トール)。 ブログ作成 ...
-
-
【初心者向け】WordPressでブログ(アフィリエイト)を始める方法
はじめに 某有名YouTuberが「走り始めはアフィリエイトだった」と公言し、アフィリエイトのブームが到来しましたね。 ...