WordPressをカスタマイズして制作する方向けの情報です。
私個人の備忘録でもあります。
最新記事以外に下層ページでサムネイル写真付きを並べたいということがあります。
そして、よくあるリストタグul li とCSSを使ってレイアウトものではなく、Bootstrapを使って簡単・キレイ・自動で作りたい!ってことありますよね?(無いかなw?)
タイトルや記事内容の抜粋も表示したいっていう、よくニュースサイトなどで見かけるやつです。
実現したいこと
- 特定カテゴリのみ
- 最新n件(nは任意、今回のタグは20件で記述)
- Bootstrapを使ってグリッド表示したい
- サムネイル付き
- 記事内容を文字数指定
- 記事投稿日を掲示
ソースコード
解説
「info」というスラッグ名のカテゴリを最新20件、サムネイル付き&記事内容を文字数を指定しています。
サムネイルサイズについて
「thumb300」の箇所を「thumbnail」に書き換えることで、最小サイズ(Wordpressデフォルトサイズ)のサムネイルに変更することができます。
カテゴリの指定
2行目にカテゴリの指定を行っています。カテゴリーのスラッグを記入します。
最新の記事数を指定
3行目に記事数の指定を行なっています。最新20件出す様にしています。
記事内容の取得する文字数を指定
21行目に記事内容の文字数を指定しています。
0というのは何文字目から抜き出すか、ということなのでここでは「0文字目から30文字目まで抜き出す」という指定になっています。
Bootstrapのレイアウトを変更したい場合
この部分を修正することでレイアウトを変更できます。
今回のコードでは、PC表示で3列、SP表示で2列になる様にレイアウトしています。