WPテーマ【THE THORザ・トール】のカスタマイズメニュー【SEO設定】の使い方を詳しく解説します。
・【SEO設定】には専門用語が多すぎてよくわからない
・【SEO設定】の使い方がわからない
・【SEO設定】のオススメの設定方法が知りたい
１．【TOPページSEO設定】：TOPページの検索結果での表示設定
２．【CSS非同期読み込み設定】：CSSの読み込みを遅らせることでページの表示速度を上げる設定
３．【img非同期読み込み設定】：画像の読み込みを遅らせることでページの表示速度を上げる設定
４．【htaccess設定】：表示速度を上げるサーバー側の設定
５．【HTML設定】：ページ全体を軽くして表示速度を上げる設定
THE THOR［SEO設定］１.【TOPページSEO設定】
TOPページの<title>
■TOPページの<title>を入力
TOPページが検索結果に表示された時のタイトル部分（テキストリンク部分）の文字を入力します。（画像赤枠部分）
サイトタイトルやサイトのキャッチフレーズを記入しましょう。
□「｜KENNOSUKE BLOG」を表示する
キャッチフレーズなどサイト名が含まれていない場合は、チェックを入れると<title>の後に「｜KENNOSUKE BLOG」がつきます。
TOPページの<meta description>
■TOPページの<meta description>を入力
TOPページが検索結果に表示された時の青枠部分の文章を記入します。
１００文字程度でサイトの内容が分かり易い文章にしましょう。
THE THOR［SEO設定］２.【CSS非同期読み込み設定】
WEBページの色やサイズやレイアウトなどの見た目に関する部分を指定する言語です。
HTMLとCSSという言語の組み合わせでWEBページは作られています。
ページを表示するとき、画面に表示されていない部分は最初に読み込まず、スクロールして画面に表示されるときに読み込む機能です。
ページを表示するスピードが速くなるので、ユーザーのストレスが減り、検索順位も上がり易くなります。
□メインCSS(style.css)を非同期読み込みにする
メインCSSの読み込みを遅延させます。
メインCSSは適応範囲が大きいので、表示速度は上がりやすいですが、表示する際に一瞬デザインが崩れ易くなります。
一瞬かもしれませんが、ユーザーが違和感を感じたり不安になったりすることも考えられるので、個人的にはチェックを入れないことをオススメします。
□子テーマCSS(style-user.css)を非同期読み込みにする
子テーマCSSの読み込みを遅延させます。
子テーマCSSも適応範囲は大きいですが、メインCSSほどではないのでデザインもそんなに崩れません。
なのでチェックを入れても大丈夫です。
□アイコンフォントCSS(icon.min.css)を非同期読み込みにする
アイコンの読み込みを遅延させます。
アイコンは適応範囲が小さくデザインが崩れる心配もないのでチェックを入れておきましょう。
□GoogleフォントCSS(Lato)を非同期読み込みにする
Googleフォント(Lato)の読み込みを遅延させます。
□GoogleフォントCSS(Fjalla)を非同期読み込みにする
Googleフォント(Fjalla)の読み込みを遅延させます。
□GoogleフォントCSS(Noto Sans JP)を非同期読み込みにする
Googleフォント(Noto Sans JP)の読み込みを遅延させます。
□SwiperCSS(swiper.min.css)を非同期読み込みにする
メインビジュアルのスライドショーやカルーセルスライダーの読み込みを遅延させます。
スライドショーやカルーセルスライダーを設定している場合はチェックしておきましょう。
□YTPlayerCSS(jquery.mb.YTPlayer.min.css)を非同期読み込みにする
メインビジュアルの背景動画の読み込みを遅延させます。
メインビジュアルに動画を表示している場合はチェックしておきましょう。
THE THOR［SEO設定］３.【img非同期読み込み設定】
□imgファイルを非同期読み込みにする
CSS非同期読み込み設定と同じで画像の読み込みを遅延するかの設定を行います。
サイトが成長するにつれてトップページに表示する画像が増えたり、画像の多い記事が増えてくるので画像の非同期読み込みは結構有効に働くと思います。
なのでチェックを入れるのをオススメします。
THE THOR［SEO設定］４.【htaccess設定】
WEBサーバーをコントロールする設定を行うファイルのことです。
例えば、
１．４０４エラーページ
２．３０１リダイレクト
３．IDやパスワードの要求
４．IP指定でのアクセスの許可・拒否
などの設定ができます。
※詳しくは『うるチカラ』さんを参考にしてください！
htaccessとは？基礎知識から設定方法まで完全解説
□ブラウザキャッシュを有効にする
一度開いたWEBページのデータを保存し、同じWEBページを次に開く時、素早く開くことができる機能です。
※詳しくは『サルワカ』さんの記事を参考にしてください！
キャッシュとは？IT初心者でも分かるように解説
ユーザーが同じページを訪れる時、素早く表示されるととても便利です。
□Gzip圧縮を有効にする
WEBページを構成している「HTML」・「CSS」などのファイルを圧縮して素早く読み込ませる機能です。
※詳しくは『ALAKI』さんを参考にしてください▼
「gzip圧縮」でWebサイトを高速化しよう！
THE THOR［SEO設定］５.【HTML圧縮設定】
□HTMLを圧縮する
HTMLファイル内のコードやコメントなどの無駄な部分を削ってファイルの軽量化を行います。
※詳しくは『ゆゆぶろぐ』さんを参考にしてください▼
HTMLの縮小-フリーのWebツールでHTMLを圧縮
まとめ〜THE THORカスタマイズ機能【SEO設定】のマニュアル！〜
専門用語の多い【SEO設定】ですが、少しでも意味が分かれば安心して設定できたと思います。
もう一度【SEO設定】でできることを見てみましょう。
１．【TOPページSEO設定】：TOPページの検索結果での表示設定
２．【CSS非同期読み込み設定】：CSSの読み込みを遅らせることでページの表示速度を上げる設定
３．【img非同期読み込み設定】：画像の読み込みを遅らせることでページの表示速度を上げる設定
４．【htaccess設定】：表示速度を上げるサーバー側の設定
５．【HTML設定】：ページ全体を軽くして表示速度を上げる設定
デザインの参考に！【THE THOR】を使った５０サイトを集めました！
WPテーマ【THE THORザ・トール】のブログサイト例【５０サイト】
他のカスタマイズ設定は済んでいますか？
・【基本設定】→【THE THORザ・トール】カスタマイズ機能マニュアル！【基本設定】の使い方！
・【共通エリア設定】→【THE THORザ・トール】カスタマイズ機能マニュアル！【共通エリア設定】を詳しく解説！
・【TOPページ設定】→【THE THORザ・トール】カスタマイズ機能【TOPページ設定】の使い方マニュアル！
・【アーカイブページ設定】→【THE THORザ・トール】カスタマイズ機能【アーカイブページ設定】のマニュアル！
・【投稿ページ設定】→【THE THORザ・トール】カスタマイズ機能【投稿ページ設定】のマニュアル！
・【固定ページ設定】→【THE THORザ・トール】カスタマイズ機能【固定ページ設定】のマニュアル！
・【カスタム投稿タイプ設定】→【THE THORザ・トール】カスタマイズ機能【カスタム投稿タイプ設定】のマニュアル！