CSSやJavascriptを最適化してくれるプラグイン「Head Cleaner」の設定方法

Head Cleanerは、WordpressのヘッダーやフッターにあるCSS・Javascriptのコードを最適化してくれるプラグインです。

コードを最適化することで、Wordpressの高速化を期待できるというメリットがあります。

早速設定方法を見ていきましょう。

スポンサーリンク




Head Cleanerの設定方法

まずはHead Cleanerをインストールしましょう。

プラグインのインストール方法については、WordPressでプラグインをインストールする2つの方法をご参考ください。

インストールが完了したら、管理画面の設定メニューから、Head Cleanerを選択します。

Head Cleanerの設定画面が表示されますので、以下の項目にチェックを入れていきましょう。

  • CSS と JavaScript を、サーバ上にキャッシュする
  • 複数の CSS を結合する
  • CSS を最適化する
  • 複数の JavaScript を結合する
  • JavaScript を小さくする
  • フッタ領域の JavaScript も対象にする
  • 内の JavaScript を、フッタ領域に移動
  • Google Ajax Libraries を利用する

check1

上記の設定でCSSとJavascriptのコードを最適化し、サーバーにキャッシュすることで無駄な読み込みを減らし、ページを高速に表示させることができます。

さらに、以下の3つの項目にもチェックをしましょう。

  • メタタグ “generator” を削除
  • リンクタグ “RSD” を削除
  • リンクタグ “wlwmanifest” を削除.

これらのタグを削除することで、セキュリティの強化につなげます。

キャッシュファイルを削除する

キャッシュ機能はWordpressの高速化を実現する上で非常に便利な機能です。

しかし、一方でサーバーにキャッシュファイルが残ったままの状態でWordpressを更新したり、プラグインを導入すると変更が反映されない場合があります。

そのような場合は、いったんサーバーに残っているキャッシュファイルを全て削除します。

Head Cleaner 設定のページ下部にキャッシュファイル削除という項目がありますので、削除ボタンをクリックしましょう。

削除後に、変更が正しく反映されているか確認しましょう。

以上、CSSやJavascriptを最適化してくれるプラグイン「Head Cleaner」の設定方法でした。

Head Cleanerの設定方法については、以下の記事を参考にさせていただきました。
Head Cleaner の最も理想的な設定方法

Wordpressの中級者以上を目指すなら

Wordpressの中級者以上を目指すのであればオンラインスクールもおすすめです。

筆者も講師(メンター)の一人ですが、オンラインスクールの一つ「Techacademy」ではWordpressをカスタマイズするために必要なカリキュラムが用意されています。

オンラインブートキャンプ WordPressコース

Wordpressにも利用されているPHPを利用してWebアプリケーションを開発してみたい方には「PHP/Laravelコース」がおすすめです。

オンラインブートキャンプ PHP/Laravelコース
スポンサーリンク







シェアする

  • このエントリーをはてなブックマークに追加

フォローする