THE THOR（ザ・トール）設定方法のすべて その４「TOPページ設定」
katsuです。
WordPressのテーマTHE THOR（ザ・トール）の設定方法を順に説明しています。今回は項目「TOPページ設定」の設定方法をご紹介します。
THE THOR（ザ・トール）「TOPページ設定」
メインビジュアル設定
メインビジュアル設定
メインビジュアルとは、トップページのヘッダーに表示される大きな画像（タイトルが書いている部分）のことです。ご覧いただいた通り、活ノートでは「表示」設定としています。実際に撮影したオリジナルの画像を使っています。
細かい設定については、スマホは非表示にする：無効、表示サイズ：ワイドサイズ（デフォルト）、スマホ表示時の表示サイズ：100、PC表示時の表示サイズ：150としています。
【’19.7.4追記】
タイトルとタイトル画像を変更しました。それに伴い、画像の表示サイズをスマホ100、PC150としています。ここばかりは実際に表示させて確認するしかありません。このあたりの変更理由については、下記の記事で紹介しています。
【Wordpress】そこのあなた！ブログ改革する前にこれだけは絶対読んどけ！ katsuです。 何となくですが、少しブログを改造してみたい気分になりました。 このブ[…]
メインビジュアルの表示モード設定
表示モードは「静止画（デフォルト）」で使用しています。他にもYouTubeやスライドショー表示もできるようですね。YouTubeは持っていませんし、スライドショーにしても画像をパラパラと動かすとページが重くなったり、管理が大変になりそうだったので試してもいません。こだわりのサイトにしたい方には良い機能だと思います。
静止画時の設定
メインビジュアル画像を登録することができます。このサイトの場合は、960×260pxで36kBの画像を使っています。あまり小さすぎるとPC表示で荒くなりますし、大きすぎると重くなります。
画像のマスクは無し（デフォルト）、タイトルはご覧の通り、「いいものなんでも。活ノート。」を2列に表示しています。サブタイトルは空欄にしています。ボタンも表示できるようですが、こちらは設定していません。どうしても押してほしいボタンを配置するとめちゃくちゃ効果的だと思います。
【’19.7.4追記】
タイトルはHTMLタグを使って文字の大きさと2列表示することにしました。こんな感じのHTMLです。
YouTube背景動画時の設定
全てデフォルトの設定無しにしています。YouTubeは使っていませんので・・・。静止画と同じく、タイトルとサブタイトルを表示し、そのバックグラウンドで動画を動かすことができるようですね。
YouTubeを使っている方は設定してもよいかもしれませんが、必然的に動画が再生されてしまうのは如何なものかと思います。スマホのデータ通信を圧迫しそうです。
スライドショー時の設定
こちらもYouTube設定と同じく、全てデフォルトの設定無しにしています。
画像を5枚まで登録することができ、スライドショー表示とすることができるようです。特筆すべきは、5枚それぞれにタイトルとサブタイトルが個別に登録できることでしょうか。アルバム的にお気に入りの5枚を表示することができそうです。
メインビジュアル下お知らせ設定
メインビジュアル下の注目エリア設定
メインビジュアルのすぐ下にお知らせメッセージを表示することができます。このサイトでは「非表示」にしています。
共通エリア設定の「ヘッダーお知らせ」機能に似た機能ですね。「ヘッダーお知らせ」機能はメインビジュアルの上に電光掲示板のように文字を横流しする表示でしたが、こちらは文字を動かすことはできません。文字がパラパラ動くのが嫌であれば、こちらのメインビジュアル下にお知らせを記入したほうがよいでしょう。
このエリアには文字列だけではなく、ボタンを表示しリンクを張ることもできます。どうしても紹介したいURLがある場合は効果的かもしれません。
【’19.7.4追記】
カルーセルスライダーを廃止したと同時に「表示」設定としました。そしてキャッチコピーは空欄としています。
なぜこんなことをしているかというと、メインビジュアル（トップページの画像）とピックアップ3記事を同時に表示すると、これらが隙間なくピッタリとくっついてしまい、見づらいページとなってしまうからです。反則かもしれませんが、このお知らせ設定欄を帯として画像に区切りを入れています。
【’19.12.4追記】
更に設定を変更しました。この欄にはキャッチコピーとリンクボタンを表示することができますが、キャッチコピーを空欄とし、リンクボタンにスポンサー様ご紹介ページへのリンクを張りました。
ようやく記事の執筆依頼を少しずつ頂くことができるようになりました。そんなスポンサー様とも言うべきご依頼主を紹介させて頂きたく、専用のページへリンクすることにしました。TOPページのボタンを押してみてください！
カルーセルスライダー設定
カルーセルスライダー設定
カルーセルスライダーとは、横にスライドすることができるサムネイル（画像）付きの記事の紹介エリアのことです。活ノートでもカルーセルスライダーを使っています。トップページに戻ると、ヘッダー画像のすぐ下にパラパラと動くスライダーがあります。
設定については、カルーセルスライダー「表示」とし、それ以外は全てデフォルト設定としています。表示条件を「無し（デフォルト）」にしていますので、ランダムで記事が紹介されている形です。ここを記事指定すると、指定した記事のみがスライダー表示されるので、どうしても読んでほしい記事は表示条件を設定してもよいでしょう。
表示件数は10件、画像アスペクト比16:9についてもデフォルト設定のままとしています。アスペクト比については、デフォルトが一番美しく表示されると思って設定変更していませんが、サイトの雰囲気に合わせて選ぶと良いと思います。
【’19.7.4追記】
「非表示」設定に変更しました。カルーセルスライダーを表示すると、トップページを表示してから記事アーカイブ（新しい記事が並んでいる部分）までが遠くなるのです。ユーザビリティを最大限に考慮し、廃止することにしました。
詳しくはタイトルの変更と同じく、こちらの記事をご覧ください。
【Wordpress】そこのあなた！ブログ改革する前にこれだけは絶対読んどけ！ katsuです。 何となくですが、少しブログを改造してみたい気分になりました。 このブ[…]
ピックアップ３記事設定
ピックアップ３記事設定
ピックアップ３記事とは、このような表示です。公式マニュアルからこの画像をお借りしてきました。
サイト内でアピールしたい３記事を表示することができるようです。活ノートでは、記事をまんべんなく見ていただきたいということと、最新記事から順に並んでるほうがキレイと感じる理由から「非表示（デフォルト）」としています。ただ、表示するとサイトのオシャレ度は格段に上がる気もします。
セクションの見出し（参考画像では「PICKUP」）や、補足情報（参考画像では「ピックアップ記事３」）など、細かい設定も行うことができます。表示したい３記事については、記事IDを入力することで任意の３記事を表示することができます。
【’19.4.14追記】
設定を変更し、ピックアップ記事を表示する設定へと変更しました！ブログ紹介カテゴリを開始しましたので、少しでも目立つようにしたいためです。設定は以下の通りです。
PICKUP3記事を表示するか：表示
セクションの見出し：PICKUP3
見出しを太字にする：しない
見出し右の補足情報：ピックアップ記事3
画像アスペクト：16:9
画像のマスク：ブラック
カラー系マスクの色：無し（デフォルト）
記事のID：好きな３つのIDを登録
変更してみて大満足。かなり目立つ3記事宣伝が出来上がったと感じています。また、大きな特徴としてIDを登録しなければ最新の3記事が自動的に選択されて表示されるようです。唯一、表示する記事を変更しようとするたびにIDを入力し直さなければならないのが手間ですね。
記事ランキング設定
記事ランキング設定
まず、記事ランキングとは何か。公式マニュアルの画像を紹介します。
このように、人気記事をランキング表示することができます。しかし・・・ここで設定を「記事ランキングを表示するか選択：表示」にしても、活ノートでは変化がありません・・・。THE THORでは未だにいくつか意味不明の設定があります。
活ノートの設定は、「非表示（デフォルト）」としており、以降の設定も全てデフォルト（空欄）のままにしています。サイドバーに人気記事が表示されていますが、これは「人気記事」ウィジェットを表示しています。この外観設定で変な設定をするとウィジェットとケンカしますので、非表示にするのがベストと判断しました。
カテゴリ最新記事設定
カテゴリ最新記事設定
活ノートの設定を順にご紹介します。
カテゴリ最新記事を表示するか選択：表示
表示条件を選択：無し（デフォルト）
指定するID：空欄
セクションの見出しを設定：CATEGORY（見出しを太文字にするチェック無し）
見出しの左に表示するアイコンを入力：空欄
見出しの右に表示する補足情報：カテゴリ最新記事
画像アスペクト比：１：１
投稿日を表示する：する
更新日を表示する：する
この設定は、サイトのトップページ（ホームのみです）に各カテゴリの最新記事を表示するかどうかの設定です。活ノートのトップページに戻り、下部へ進んでみてください。少し壁紙がグレーがかった「CATEGORY」という項目があります。活ノートではカテゴリを現状４種類使っていますので、４つの最新記事が紹介されています。
表示条件を「無し」にしておけば、全カテゴリの最新記事が表示されます。カテゴリを指定したければ、「指定したカテゴリ」または「指定したカテゴリ以外」を表示することができます。
この設定は、基本的にほぼデフォルトのまま使っています。意外と簡単に表記を変えられますので、好みに応じて変更してみると良いでしょう。そもそも、サイトをできる限りシンプルにしたい人は非表示にするのもありだと思います。カテゴリのページに進めば必然的に最新記事はすぐに探せますからね。
さて、以上が「TOPページ設定」の全てです。次回「アーカイブページ設定」の設定方法をご紹介します。
活ノートでは最新記事の投稿情報をメールでお伝えしています。お気軽にご登録ください！
配信例はこちらにあります。
↑2いいやん！されています。良い記事でしたら「いいやん！」クリックお願いします。
下のSNSボタンから記事拡散にもご協力お願い致します。
読み込み中...
