Autoptimizeプラグインの設定や使い方

【2021年最新版】Autoptimizeプラグインの設定や使い方まとめ!【サイト速度最適化】

悩み人
WordPressのプラグイン「Autoptimize」の設定方法や使い方がわからない!どうすれば良いの?

こちらの疑問を解決させます。

本記事の内容

  • Autoptimizeのインストール方法
  • Autoptimizeの設定方法
  • Autoptimizeの使い方

2021年3月からGoogle様はサイトの表示速度がそのサイトの評価を決める上でさらに重要視すると言っていたので、AutoptimizeはWordPressを運営する方は必須のプラグインになると思います。

承太郎
もしサイトの表示速度が遅いと感じるのであればAutoptimizeをインストールしてみましょう!

Autoptimizeのインストール方法

Autoptimizeのインストール方法

AutoptimizeをWordPressにインストール方法は他のプラグインと同じです。

WordPressの管理画面から、

「プラグイン」→「新規追加」

の順番でクリックします。

Autoptimizeのインストール方法

検索窓に「Autoptimize」と入力し、赤枠のプラグインの「今すぐインストール」をクリックしてください。

Autoptimizeのインストール方法2

最後に「有効化」とクリックすればAutoptimizeのインストールの完了です。

承太郎
他のプラグインも同じ方法でインストールできます!

Autoptimizeの設定と使い方

Autoptimizeの設定と使い方

次にAutoptimizeの設定を行なっていきます。

承太郎
チェックマークを入れるだけだから超簡単です!

Autoptimizeの設定方法2

Autoptimizeでは以下の、

  • JS、CSS&HTML
  • 追加

こちらの2つのタブの設定を行なっていきます。

Autoptimizeの設定方法

「プラグイン」→「Autoptimizeの設定」

の順番にクリックしてください。

一つ一つ設定していきましょう。

JS、CSS&HTMLの設定

JS、CSS&HTMLの設定の中でも

  • JavaScript オプション
  • CSS オプション
  • HTML オプション
  • その他オプション

こちらの4つの設定が必要になります。

承太郎
画像を見ながら進めていってください!

JavaScript オプション

JavaScript オプション

  • JavaScript コードの最適化
  • JS ファイルを連結する

こちらの2つにチェックマークを入れてください。

CSS オプション

CSS オプション

  • CSS コードを最適化
  • CSS ファイルを連結する
  • インラインの CSS も連結
  • すべての CSS をインライン化

こちらの4つにチェックマークを入れてください。

HTML オプション

HTML オプション

  • HTML コードを最適化

こちらの1つだけにチェックマークを入れてください。

その他オプション

その他オプション

  • 連結されたスクリプト / CSS を静的ファイルとして保存
  • 除外された CSS ファイルと JS ファイルを最小化
  • ログイン状態の編集者、管理者にも最適化を行う

こちらの3つにチェックマークを入れてください。

これでJS、CSS&HTMLの設定が完了しました。

最後に「変更を保存してキャッシュを消去」をクリックで完了です。

追加

Autoptimizeの追加

  • Google フォントの削除
  • WordPress コアの絵文字用のインライン CSS、インライン
  • JavaScript、およびその他の自動化されていない JavaScript ファイルを削除します。

こちらの2つにチェックマークを入れてください。

これでAutoptimizeの設定が完了しました。

Autoptimizeでサイトの速度を最適化

WordPressのプラグイン「Autoptimize」の設定方法についてまとめました。

このプラグインを入れることでブログの表示速度が向上させることができるので、是非インストールしてみましょう。

承太郎
他の方法でブログの表示速度を上げたい方は「【ページ表示速度の最適化】EWWW image optimizerの使い方の設定まとめ!【画像を一括圧縮】」もインストールして設定してみましょう!

\ 当ブログで絶賛使用中WordPressテーマ /

5,000円相当プラグイン&当ブログ限定特典付き

必読【【特典付き】AFFINGER6を使ってみた感想と評判まとめ【Action】