トップページの記事一覧が表示される方法を変更する

WordPressのブログではトップページに記事の一覧が表示されます。Cocoonでは記事一覧の表示する方法としてリスト形式やカード形式などいくつかの方法があらかじめ用意されています。ここではWordPressのテーマとしてCocoonを使用している場合にトップページの記事一覧の表示方法を変更する手順について解説します。

(Last modified: )

ヘッダー画像を設定する

Cocoonの初期設定ではトップページを表示した時に記事の一覧がリスト形式で縦に並んで表示されます。

p6-1

トップページでの記事一覧の表示の仕方を変更するには、画面左側の「Cocoon設定」メニューの中にある「Cocoon設定」メニューをクリックして下さい。

p6-2

「Cocoon 設定」画面が表示されます。

p6-3

画面上部にあるタブ一覧の中から「インデックス」タブをクリックして下さい。

p6-4

「インデックス」に関する設定画面が表示されます。

p6-5

「カードタイプ」の項目で表示方法を選択します。選択可能な項目は「エントリーカード」「大きなカード(先頭のみ)」「大きなカード」「縦型カード2列」「縦型カード3列」「タイルカード2列」「タイルカード3列」です。

p6-6

例えば「大きなカード」に変更するには「大きなカード」の項目にチェックして下さい。

p6-7

設定が終わりましたら画面上部または画面下部にある「変更をまとめて保存」をクリックして下さい。

p6-8

それではブログを表示してみます。トップページで表示される記事の一覧が、大きな画像が使用されたものに変更されています。

p6-9

カードタイプ毎にどのように表示されるのか

それではそれぞれのカードタイプを選択した時にどのように表示されるのかをPCからの場合とモバイルからの場合でそれぞれ見てみます。なおモバイルからの場合は、カード型やタイルカード型ではあまり変化がありませんでした。

エントリーカード

p6-10

p6-17

大きなカード(先頭のみ)

p6-11

p6-18

p6-19

大きなカード

p6-12

p6-20

p6-21

縦型カード2列

p6-13

p6-22

p6-23

縦型カード3列

p6-14

p6-24

p6-25

タイルカード2列

p6-15

p6-26

p6-27

タイルカード3列

p6-16

p6-28

p6-29

-- --

Cocoonを利用しているブログで、トップページの記事一覧の表示方法を変更する手順について解説しました。

( Written by Tatsuo Ikura )

プロフィール画像

著者 / TATSUO IKURA

これから IT 関連の知識を学ばれる方を対象に、色々な言語でのプログラミング方法や関連する技術、開発環境構築などに関する解説サイトを運営しています。