●Autoptimizeプラグインの使い方と設定方法について知りたい。
今回はこんなお悩みに答えていきます。
こんな方におすすめ
- WordPressブログ初心者
- サイト速度を改善して高速化したい方
- プラグインを利用して簡単にサイトスピードを上げたい方
本記事の信頼性
検索ページがなかなか表示されず、他のページに移った経験は誰でもあると思います。そうなると読者の機会損失になるので、サイトスピードの高速化が必要不可欠です。
当サイトは本プラグインを活用し、サイト速度MAXを達成しています。
今回はWordPressのプラグイン『Autoptimize』でサイト速度を最適化する設定方法について紹介します。
本記事を読めば、簡単にサイト速度を高速化できるので、ぜひ試してみてください。
AFFINGER6で高速化
.
当ブログはAFFINGER6を利用し、ブログ収益6桁・サイト速度高速化を達成しました。
.
ブログ運営にはWordPressテーマ選定が欠かせませんので、まだ導入してない方はチェックしてみてください。
.
＼AFFINGERの概要なら／
＼AFFINGERの評判なら／
それでは早速始めていきます。
目次
Autoptimizeとは？【サイト速度最適化プラグイン】
Autoptimizeとは？【サイト速度最適化プラグイン】
Autoptimizeはサイトの読み込み速度を最適化できるプラグインです。
最適化できる理由は、JavaスクリプトやCSSオプション、画像の読み込みなどのサイト内での設定を簡単に変更できるからです。
サイトスピードにはJavaやCSSのコードが大きく影響するので、この部分を変えるということです。
Autoptimizeのインストール方法
WordPressプラグイン：Autoptimizeのインストール方法
Autoptimizeをインストールしていきます。
管理画面から『プラグイン』⇒『新規追加』をクリックします。
Autoptimizeのインストール画面
Autoptimizeを検索して『今すぐインストール』をクリックします。
後は通常通り、インストール完了後『有効化』をクリックして完了です。
Autoptimizeの使い方
Autoptimizeの使い方
続いてAutoptimizeの使い方をご紹介します。まずは設定画面に移りましょう。
管理画面⇒Autoptimizeの設定画面に移動する
設定画面に移ると下記のような画面になります。
Autoptimize設定画面
Autoptimizeの設定は複数ありますが『JS、CSS＆HTML』、『画像』の2つを設定していきます。
Autoptimizeの設定方法①：JS、CSS＆HTML
Autoptimize のJS、CSS＆HTMLの設定方法
Autoptimize のJS、CSS＆HTMLの設定方法を解説します。
Autoptimizeの『JS、CSS＆HTML』設定方法5つ
- ①JavaScriptオプション
- ②CSSオプション
- ③HTMLオプション
- ④CDNオプション
- ⑤その他オプション
1つずつ解説します。
①JavaScriptオプションの設定
Autoptimize：①JavaScriptオプションの設定
JavaScriptオプションの設定はチェックを入れなくてOKです。
『JavaScriptコードの最適化』にチェックを入れるとファイル内の改行を取り除いてJavaScriptを圧縮してくれますが、サイト内の表示崩れの可能性があります。
なのでここはチェックを入れず次に進みましょう。
②CSSオプションの設定
②CSSオプションの設定
CSSオプションの設定では「CSSコードを最適化」のみにチェックを入れます。
CSSコードの最適化
CSSファイルを連結する
インラインのCSSも連結
③HTMLオプションの設定
③HTMLオプションの設定
HTMLコードを最適化にチェックを入れます。
HTMLコードを最適化し圧縮化できる設定ですが、改行がなくなりデザイン崩れが発生する可能性があるので、エラーが出ればチェックを外してください。
④CDNオプションの設定
Autoptimize：④CDNオプションの設定
CDNオプションは初期設定のままでOKです。そのまま次に進みましょう。
⑤その他オプションの設定
⑤その他オプションの設定
その他オプションの設定は上記3つを選択しましょう。
連結されたスクリプト/CSSを静的ファイルとして保存
ログイン状態の編集者、管理者にも最適化を行う
追加の互換性ロジックを無効化にもチェックを入れたら、『変更の保存とキャッシュの削除』をクリックしましょう。
Autoptimizeの設定方法②： 画像最適化
Autoptimizeの設定方法②： 画像最適化
画像最適化の『画像最適化とCDN』にチェックを入れます。
変更の保存をクリックして設定の完了です。
Autoptimize設定時の注意点
Autoptimize設定の注意点
プラグインAutoptimizeは設定後にレイアウト崩れなどのデザインに異常がある場合があります。
必ず設定後はレイアウトに問題ないか確認しましょう。
デザイン異常時の確認項目
・CSSコードを最適化
・CSSファイルを連結する
・インラインのCSSも連結
・連結されたスクリプト/CSSを静的ファイルとして保存
また他にプラグインを導入して重複している内容がある場合も異常が発生する可能性があります。
スポンサーリンク
まとめ：Autoptimizeを設定してサイトスピードを改善しよう
まとめ：プラグインAutoptimizeを使用してサイトスピードを改善しよう
今回はAutoptimizeの使い方と設定方法について解説しました。
Autoptimizeは5分程度で設定ができてサイトスピードも改善できるので、活用してない方はぜひ導入してみてください。
サイトスピードを改善できればSEO対策にもなるので、やれることから実践していきましょう。
本記事を最後まで読んで頂きありがとうございました。
それでは本日はこの辺りで。
-
【2025年版】WordPressのおすすめプラグイン15選＆導入手順を解説
続きを見る
-
『使用していない JavaScriptの削除』を改善する方法【サイトスピードUP】
続きを見る
人気記事【2025年4月】WordPressブログのおすすめテーマ11選を徹底比較