WordPress Popular Postsの記事タイトルに順位(番号)をつける

 WordPress Popular Postsとは、記事を人気順に表示してくれるプラグインです。一定期間で閲覧数を集計し、閲覧が多い記事を順に表示します。私のブログでは、右サイドの「人気記事 TOP10」になります。
 今回、記事ランキングの表示部分に順位(番号)をつけます。変更はCSSファイルだけです。基本、下記のコードをコピーペーストすると変更できます。

WordPress Popular Postsの記事タイトルに番号をつける
 

CSSの変更について

変更するCSSのファイルは、下記の場所になります。
「自分のテーマ」は外観、テーマで使用しているものです、

(フォルダー階層)
./wp-content/themes/自分のテーマ/style.css

CSSの変更

.wpp-list {
 counter-reset: wpp-ranking;
}
.wpp-list li:before {
 content: counter(wpp-ranking, decimal);
 counter-increment: wpp-ranking;
 padding-right:8px;
}

paddingは、番号と記事タイトルの間隔を調整しています。


(参考サイト)
【WordPress】人気記事ランキングに「順位」をCSSだけでいい感じに表示させる【WordPress Popular Posts】

カテゴリー: WordPress, ホームページ作成 タグ: パーマリンク

コメントを残す