【Luxeritas】ウィジェットのカテゴリー欄に罫線を追加する方法
※(2019/4/18)
記事を修正いたしました。
以前の記事ではクラス名を決め打ちしていましたが、コードの拡張性を考えた場合、以下修正記事の内容がスマートと判断致しました。ご迷惑をお掛けして大変申し訳ありません。
こんにちは。行未です。
当サイトのテーマはLuxeritasですが、相変わらず使いやすくて便利でございます。
さて、今回はウィジェットのカテゴリに罫線を追加する方法です。
そもそも何故この記事を書くに至ったかというと、
Luxeritasのウィジェットの、「更新された記事」等はデフォルトで罫線が入っているんですね。
ですが、カテゴリー欄については罫線が入っていません。
同様に罫線が入っていない例としては、アーカイブ等もありますね。
それで、どうせなら罫線を入れたいと思い立ったわけです。
完成形は以下の形です。それぞれ大見出しの下に罫線を入れます。

そもそもカテゴリー欄を追加するには
前段階として、Luxeritasでカテゴリー欄を追加する方法について説明します。
WordPressのダッシュボード画面にて、「外観」→「カスタマイズ」→「ウィジェット」→サイドバータイプを選択→「ウィジェットを追加」をクリックし、カテゴリーをクリックすれば追加されます。

もしくは、WordPressのダッシュボード画面の「外観」→「ウィジェット」からでも同様に設定が行えます。
罫線の追加
今回の追記に当たり、子セレクタを用います。
子テーマのスタイルシートに以下のように追記します。
基本的にコピペでOKです。
#side .widget_categories > ul > li:not(:last-child) {
border-bottom:dotted 1px #ccc;
}
カテゴリはリスト形式で記述されています。
したがって、「li:not(:last-child)」と記述することにより、最後のリスト要素のみ除外対象とします。
ディスカッション
コメント一覧
まだ、コメントがありません