Autoptimizeの不具合の少ない設定方法と使い方【レンダリングを妨げるリソースの除外】

この記事では、WordPressプラグイン「Autoptimize」で不具合の少ないおすすめの初期設定の方法と使い方を、画像を用いてわかりやすくご紹介します。

「Autoptimize（オートプティマイズ）」は、CSS・JavaScript・HTMLなどを最適化する高速化プラグインです。

PageSpeed Insightsの「レンダリングを妨げるリソースの除外（Eliminate render-blocking resources）」を改善できます。

遅延読み込み機能もありますが、SWELL・SANGO・Cocoonなどのテーマ機能との重複に注意してください。

また、キャッシュサイズが増えると警告メールが届くため、事前に対策しておきましょう。

suya

設定を誤ると、逆に遅くなるデメリットもあります。

なるほどくん

なるほど！設定に注意します。

あわせて読みたい

【2025調査】WordPress高速化プラグインの速度ランキング（キャッシュプラグイン等） この記事では、6万以上のサイトデータからWordPress高速化プラグインの平均表示速度を比較ランキングでご紹介します。 高速化プラグインの表示速度比較は難しいため、ど…

 この記事を書いた人

suya
@suyasite

suya @suyasite

• 「AI Direct Editor」開発者
• 「WP-Search」開発者
• 「SEOキーワードツール」

• 「AI Direct Editor」開発者
• 「WP-Search」開発者
• 「SEOキーワードツール」

この記事を最後まで読めば、WordPress（ワードプレス）を高速化できます。

ぜひ最後まで進めてみてください。

1) プラグイン「Autoptimize」をインストール

WordPress（ワードプレス）にログインしたら、左メニューの[プラグイン]→[新規追加]をクリックして、[プラグインの検索]をします。

[プラグイン]→[新規追加]から「Autoptimize」を検索して、[今すぐインストール]した後に[有効化]します。

2) プラグイン「Autoptimize」の初期設定

1) JS、CSS & HTML（重要度：高）

左メニューの[設定]→[Autoptimize]をクリックして、[JS、CSS & HTML]タブを開きます。

JavaScriptオプションで[JavaScript コードの最適化]をONにします。

CSSオプションで[CSS コードを最適化]をONにします。

HTMLオプションで[HTML コードを最適化]と[インラインの JS/CSS も最小化]をONにします。

インラインのJS・CSSはここで最適化設定します。忘れずに設定しておきましょう。

その他オプションはそのままで[変更の保存とキャッシュの削除]をクリックします。

[投稿/ページごとに設定]がONの場合、投稿/固定ページのエディター（編集画面）にAutoptimizeの設定メタボックスが表示されます。

2) 画像（重要度：低）

「Autoptimize」は、画像のWebP化や遅延読み込みも可能ですが、他のプラグインを使用することを推奨します。

[画像]タブは、何も設定しません。

[画像最適化と CDN]をONにすると、画像がオンザフライでWebPに変換されます。

オンザフライは、ユーザーがページにアクセスしたときに、初めて画像を変換するということです。

事前に変換画像を準備しておいたほうがいいですので、「EWWW Image Optimizer」「LiteSpeed Cache」などを使用してWebP化することをおすすめします。

マニュオン

【WebP化】EWWW Image Optimizerの設定方法と使い方【SWELL・Cocoon・SANGO対応】 | マニュオン この記事では、画像圧縮プラグイン「EWWW Image Optimizer」の初期設定と使い方を、画像を用いてわかりやすくご紹介します。 「EWWW Image Optimizer」を使えば、画像圧縮…

マニュオン

LiteSpeed Cacheの不具合の少ない設定方法と使い方【SWELL・Cocoon対応】 | マニュオン この記事では、WordPressプラグイン「LiteSpeed Cache」で不具合の少ないおすすめの初期設定の方法と使い方を、画像を用いてわかりやすくご紹介します。 「LiteSpeed Cache…

3) クリティカルCSS（重要度：低）

クリティカルCSS（Critical CSS）については、有料機能で難易度が高いためここでは割愛します。

4) 追加（重要度：中）

[追加]タブを開いて、Googleフォントの[結合とヘッダーでのリンク]と[絵文字の削除]をONにします。

その他の設定はそのままで[変更を保存]します。

preconnectもpreloadも上級者向けの設定です。

3) キャッシュを削除する方法

カスタマイズを行なった場合や不具合が発生した場合は、一度キャッシュをクリア（パージ）することをおすすめします。

キャッシュ消去（重要度：高）

アドミンバーから[Autoptimize]→[CSS/JS キャッシュ消去]します。

4) Autoptimize のキャッシュサイズ警告メールへの対応

Autoptimizeを導入して使用していると、突然「Autoptimize のキャッシュサイズ警告」というメールが届くことがあります。

Autoptimize のキャッシュサイズが肥大化してきたので、キャッシュの削除を検討してください。

Autoptimize のキャッシュサイズ警告

キャッシュをクリアしても繰り返し警告メールが届きます。

警告メールを止めるには、以下のコードを子テーマなどのfunction.phpに貼り付けてください。

function manuon_autoptimize_maxsize() {
  return 10 * 1024 * 1024 * 1024;
}
add_filter('autoptimize_filter_cachecheck_maxsize','manuon_autoptimize_maxsize');

この例では、キャッシュサイズの上限値を10GBまで上げています。

子テーマを使いたくない場合は、「Code Snippets」プラグインがおすすめです。

あわせて読みたい

Code Snippetsの使い方と設定方法【WordPress子テーマ不要】 この記事では、WordPressプラグイン「Code Snippets」の使い方と設定方法を、画像を用いてわかりやすくご紹介します。 「Code Snipeets（コードスニペット）」を使えば…

この記事のまとめ

プラグイン「Autoptimize」のおすすめの設定方法と使い方を見てきました。

念のためデザイン崩れやコンタクトフォームなどの動作確認をおすすめします。

なるほどくん

ページ表示が速くなりました。

suya

よい結果が出たら、ぜひ教えてください。

よくある質問（FAQ）

「Autoptimize のキャッシュサイズ警告」というメールが届くのはなぜですか？

キャッシュの上限値に達したためです。

対策はこちらをご覧ください。

この記事の参考情報

Autoptimize公式サイト

Autoptimize