Blog Plugin

【サイト速度を最適化】Autoptimizeプラグインの設定方法

2020年6月28日

・サイトスピードを上げたい!

・Autoptimizeの設定方法を詳しく教えて!

こんな悩みを解決します。

この記事の信頼性

大学で学校の勉強をする傍ら、副業でブログ収益6桁を稼いでいる僕が、ブログ運営についてわかりやすく解説します。

『Autoptimize』とは、サイトの読み込み速度を向上するプラグインです。

このプラグインを導入して、5分くらい設定をすれば誰でも簡単にサイトスピードを上げることができます。

そこで今回は、優秀なプラグインである『 Autoptimize 』の設定方法について紹介していきます。

5分くらいあれば簡単に設定できるので、まだ入れていない人は導入してみましょう!

それでは早速、『導入&設定方法』について紹介していきます。

Autoptimize のインストール方法

まずは、 Autoptimizeプラグインをいつも通りインストールしていきます。

WordPress管理画面から、『プラグイン』➔『新規追加』をクリックします。

右上の検索窓に『Autoptimize』と入力すると、画像のようなプラグインが出てくるので、インストールします。

インストールが終わったら、「有効化」して終了です!

『Autoptimize』の設定

次に、プラグインの設定をしていきます。

プラグインの設定は、3分ほどあれば完了できますよ。

「設定」➔「Autoptimize」を選択

まずは、WordPress管理画面から、『設定』『Autoptimize』を選択してください。

画面が移動すると、上のような画面に移動します。

今回は、3色の色で囲った部分のタブを設定して完了です。

それでは早速設定していきましょう!

JS,CSS&HTMLタブの設定

まずは、「ピンク」の『JS,CSS&HTMLタブ』の設定をしていきましょう。

下の画像のように、該当する箇所にチェックを入れればOKです。

「CSSオプション」

「HTML」オプション

「その他のオプション」

チェックを入れたら、『変更を保存してキャッシュを消去』をクリックすればOKです。

ここで、一度サイトをみてデザインが崩れている場所がないか確認しましょう。

もしデザインが崩れているようであれば、以下の項目のチェックを1つずつ外して検証してみてください!

  • インラインのJSを連結
  • 全てのCSSをインライン化
  • インラインのCSSを連結
  • 連結されたスクリプト/CSSを静的ファイルとして保存

原因がわかったら、その項目のチェックは外しておきましょう。

画像タグの設定

次に、青色の『画像タグ』の設定をしていきます。

「画像タグ」

チェックを入れたら、『変更を保存』をクリックすればOK!

設定完了まであと1項目です!

追加タブの設定

最後に、黄色の『追加タブ』を設定します。

上の2か所にチェックをいれて、保存すれば設定完了です。

お疲れさまでした!!

まとめ:Autoptimizeを使ってサイトスピードを最適化しよう!

今回は、「Autoptimize」を使ってサイトを最適化するための設定方法について紹介してきました。

設定自体は5分くらいあればできるので、空き時間でサクッと設定してみてください。

また、サイトスピードの改善方法については、以下の記事で詳しく紹介しているので、参考にしてみてください。

関連記事:
>>【SEO対策】サイト高速化のためにやった5つのこと【解決策あり】

-Blog, Plugin