WordPress公式無料テーマ「錦(Nishiki)」では、ウェブサイトの表示速度改善などのパフォーマンス向上を図るため、テーマで使用しているjQueryの読み込みを最適化する設定ができます。以下に設定手順を書きましたので、ご参考ください。

テーマ専用プラグインを有効化しよう

最適化を行う前に、まずはテーマ専用プラグイン「Nishiki Growing Beauty」本体をダウンロードして、プラグインをアップロード・有効化してください。※プラグインはサポトピアの会員のみダウンロードできます(会員登録はこちらから)。

プラグイン本体のダウンロード・インストール方法はこちら

テーマ最適化の設定方法

プラグイン有効後、WordPressの管理画面から「Nishiki GB」→「テーマ最適化」を選択します。

下の画像のように、テーマ最適化の画面が開くので「スクリプト」タブの「jQueryの読み込みを最適化」の項目にある「最適化する」にチェックを入れて「変更を保存」ボタンを押します。

これで設定完了です。WordPressテーマNishikiで作ったウェブサイトのページを表示する際に、jQueryスクリプトの読み込みがページ表示の遅延などパフォーマンス低下に影響しないように変更を加えています。

最適化の注意点があります

もし、最適化したことによって影響を受けるページやプラグインがある場合は、チェックを外してください。大抵はテーマ側でカスタマイズを行うことで、その影響を回避できます(おそらく影響を受けるようなウェブサイトは、テーマをカスタマイズされている方だと思います。テーマをカスタマイズされている状況はウェブサイトの数だけ様々なので、回避手順については省略します)。

適用前と比べてみよう

最適化を行う前と後で「実際にどう変わったのか」を確認するには、テーマのデモサイトでご確認いただいた方が話が早いと思います(デモサイトは最適化にプラスして公式プラグイン「WP Super Cache」と「Autoptimize」を適用しています)。また、Googleが提供するウェブサイトのパフォーマンス計測ツール「PageSpeed Insights」でのスコア計測結果も目安の一つとしてご参考ください。サーバーはエックスサーバーを使用しています。

適用前

モバイル

PC

適用後

モバイル

PC

上記の「PageSpeed Insights」でのスコアだけを見ると、最適化の適用前と適用後では、特にモバイル(スマートフォンやタブレット)でページを開いた際のパフォーマンスに違いが出ています。

WordPressテーマNishikiはパフォーマンスを意識して作られているので、体感速度的には適用前でも十分なパフォーマンスは出ます(これが「スコアは目安の一つとしてください」という理由でもあります)。

ただ、目安とは言え「スコアが高い」ことはアピールポイントの一つにもなりますし、実際に体感速度も向上します。ですので「テーマの最適化は、パフォーマンス向上を目指したい方のためのおすすめ設定」です。

まとめ

最適化できる箇所はこの他にもいくつかありますので、今後は段階を経て随時内容を増やしていく予定です。もし、WordPress公式テーマNishikiを使っているウェブサイトのパフォーマンス向上を図りたい方は、テーマ最適化の設定をお試しください。

参考リンク

ハッシュタグ#wpnishikiをつけてシェア

このページの著者について

bouya Imamura

東京都北区十条にあるウェブサイト(ホームページ)制作会社AnimaGateの代表をやっています。サポトピアでは自社製品・サービスの全般的な開発・管理などを行っています。これまで数多くのウェブサイトの新規作成・リニューアル・運営などを経験し、WordPress(ワードプレス)公式テーマ・公式プラグインなど、ウェブサイト運営に役立つ様々なツールを開発・公開しています。→ブログはこちら