WordPressでお知らせ一覧リストのアイコンをカテゴリーごとに自動で変更させる

スポンサーリンク
WordPressでお知らせ一覧リストのアイコンをカテゴリーごとに自動で変更させるWeb制作

WordPressで制作するコーポレートサイトには「お知らせ」や「新着情報」を設置するのですが、カテゴリーごとにアイコンを変えたいなと思いました。

せっかくWordPressで作っているんだから、取得できる情報を活用して、勝手に切り替わるようにしました。その時に実装したメモです。

カテゴリーのスラッグを活用する

WordPressでカテゴリーを作成する時に設定するスラッグ。このスラッグを取得して、投稿のリストごとにアイコン(画像)を変える方法。

簡単に言い換えれば、取得したスラッグ名をCSSのクラスや画像ファイル名の一部分で置き換えます。

CSSクラスをカテゴリースラッグにする方法

カテゴリーナンバー「2」「3」「4」から5記事読み込んで、それぞれのliタグのclassをカテゴリースラッグに割り当てます。

あとは、CSSのリストアイコンや背景なりで画像を設定すればOK。

画像ファイル名の一部分をカテゴリースラッグにする方法

次に、imgタグで読み込む画像ファイルをカテゴリースラッグに置き換える方法です。やや強引ですが、CSSを使わないのでシンプル。

カテゴリースラッグは便利

今回はリストの画像を置き換える方法でしたが、このやり方を流用すれば他にも便利なことができそうですね。

スポンサーリンク

次によく読まれている記事

RABBIT PUNCH

この記事のコメント

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