Cocoonの標準の表示設定はエントリーカード(1列表示)になっていますが、今回は表示スタイルを2列に並べで表示する方法を紹介します。
![](https://i0.wp.com/umeyalabo.com/wp-content/uploads/2019/11/image-29.jpg?resize=714%2C409&ssl=1)
Cocoonの設定を変更
「Cocoon設定」⇒「インデックス」を選択
![](https://i0.wp.com/umeyalabo.com/wp-content/uploads/2019/11/image-27.jpg?resize=897%2C279&ssl=1)
表示設定を「縦型カード2列」に変更
カードタイプを「縦型カード2列」に変更して保存。
![](https://i0.wp.com/umeyalabo.com/wp-content/uploads/2019/11/image-28.jpg?resize=493%2C215&ssl=1)
ブログ記事の画面を更新すると2列表示に変わっていることが確認できます。
![](https://i0.wp.com/umeyalabo.com/wp-content/uploads/2019/11/image-30.jpg?resize=731%2C404&ssl=1)
他の表示方法
大きなカード(先頭のみ)
先頭の記事のみ大きく表示されます。
![](https://i0.wp.com/umeyalabo.com/wp-content/uploads/2019/11/image-31.jpg?resize=667%2C676&ssl=1)
大きなカード
全ての記事が大きく表示されます。
![](https://i0.wp.com/umeyalabo.com/wp-content/uploads/2019/11/image-33.jpg?resize=665%2C707&ssl=1)
縦型カード3列
ブログ記事を3列に表示できますが、この表示だと少し小さい気がします。
![](https://i0.wp.com/umeyalabo.com/wp-content/uploads/2019/11/image-34.jpg?resize=706%2C345&ssl=1)
タイルカード2列
縦長アイキャッチの形を崩さずに表示させることが可能です。
![](https://i0.wp.com/umeyalabo.com/wp-content/uploads/2019/11/image-36.jpg?resize=687%2C586&ssl=1)
タイルカード3列
タイルカードの3列表示です。
やはり3列表示だと小さく感じますね。
![](https://i0.wp.com/umeyalabo.com/wp-content/uploads/2019/11/image-37.jpg?resize=688%2C288&ssl=1)
他のブログカードを比較してみましたが、個人的には「縦型カード2列」の表示が一番バランスが良い気がします。