THE THOR(ザ・トール)の記事一覧リストの設定

 

記事一覧リストはトップページやカテゴリーページ、タグページで表示される部分です。

THE THOR(ザ・トール)の記事一覧リストの設定を、最初に変更しようとした時にそれらしいメニューを探すのに苦労しましたので、記事一覧リストの設定手順をご紹介していきたいと思います。

 

記事一覧リストの設定

 

WordPressメニューの「外観」、「テーマ」を選択し、THE THORメニューを表示させます。

THE THORメニューの「アーカイブページ設定」、「記事一覧リスト設定」を選択します。まさか「アーカイブページ設定」にあるとは思いもせず、探すのに苦労しました。

 

 

記事一覧リストのフレーム設定

 

記事一覧リストのフレームを、「無し」、「シャドウフレーム」、「ボーダーフレーム」の3つから選択します。

 

「無し」を指定した場合

「無し」を指定した場合、以下のように記事リストもメインカラムの背景色と同じになります。記事リストと記事リストの間には線(セパレーター)が表示されます。

 

「シャドウフレーム」を指定した場合

「シャドウフレーム」を指定した場合は、以下のように記事リストは白抜きになり、ボーダーは影(シャドウ)になります。

 

「ボーダーフレーム」を指定した場合

「ボーダーフレーム」を指定した場合も、以下のように記事リストは白抜きになりますが、背景色と色が違うだけで特に影など付かないシンプルなフレームです。

ただし、「シャドウフレーム」とそれほど違いは感じません。

画像アスペクト比

 

「画像アスペクト比」を「16:9」、「4:3」、「1:1」、「0:0」の4つの中から選択します。画像のアスペクト比とは縦横比のことです。

 

「画像アスペクト比」が「16:9」

「画像アスペクト比」が「16:9」がデフォルトで、これまでサンプルとした記事リスト画像のアスペクト比になります。ちなみに縦横比ですが16の方が横です。

デフォルトになっているだけあって、一番使われています。

 

「画像アスペクト比」が「4:3」

「画像アスペクト比」が「4:3」の場合は、以下のようになります。

少し縦が長くなります。

 

「画像アスペクト比」が「1:1」

「画像アスペクト比」が「1:1」の場合は、以下のように縦横が同じ長さになるのでより縦長になります。画像右にある説明文を増やしたい場合にはバランスが取れそうです。

 

「画像アスペクト比」が「0:0」

「画像アスペクト比」が「0:0」の場合は、以下のように画像を表示せず、タイトルと要約の文字だけになります。これはこれですっきりしますね。

アイキャッチ上のカテゴリ

アイキャッチ(画像)上のカテゴリを非表示にするかどうかです。チェックすればカテゴリは表示されません。

タイトルの上に表示する項目

記事タイトルの上に表示する項目を選択します。

 

投稿日、更新日

投稿日、更新日を表示したい場合にチェックします。ユーザーにとっては重要な情報になる場合が多いと思います。

 

閲覧数

記事リストを人気順表示にした場合のみ、指定したら表示されます。閲覧数は記事を書いた人が把握すれば良いので、表示させる必要はないでしょう。

 

コメント数

コメント数が表示されます。特に指定する必要はないでしょう。

 

本文(記事の要約)

記事の本文について設定します。

 

本文の文字数

本文の文字数を20文字~500文字以内で設定します。

 

続きボタン

続きボタンを表示させるかどうか指定し、ボタンに表記させる文字を設定します。

本文の右下に以下のように表示されます。

NEW&ピックアップリボン

新着記事とピックアップ記事にリボンを表示するかどうか、またリボンのアイコン指定や色指定を行います。

 

 

NEWマークリボン

NEWマークリボンを表示するかどうかを指定します。

 

以下がNEWマークリボンの例です。

 

ピックアップマークリボン

 

ピックアップマークリボンを表示するかどうかを指定します。

 

ピックアップ記事は、記事の編集画面の右側にある「ステータスと公開状態」の中に、「ブログのトップに固定」を指定する箇所があり、そこで指定したらピックアップ記事になります。

 

 

以下がピックアップマークリボンの例です。

 

 

リボンの色

リボンの色を指定します。指定しなければ、デフォルトの色になります。

 

アイコン選択

NEWマークリボンまたはピックアップマークリボンで使用するアイコンを設定します。「アイコン一覧」をクリックすると、以下のような一覧画面が表示されますので、選択します。

 

NEWマークを表示する日数

NEWマークを表示する日数の条件を設定します。

今回は以上で終了です。お疲れさまでした。

コメント

タイトルとURLをコピーしました