bbpressのトピック一覧表示はデフォルトで新着順（新しい投稿があったもの）に表示されるようになっています。しかしこれは全てのトピックでの返信があったものが同一覧で表示されるため、最近に投稿されたトピックなのか古いトピックなのか分かりづらくなっています。そこで最近投稿されたトピックは一目で分かるように新着マークを表示するやり方を紹介します。
NEWマークを表示する方法
- <?php
- $time = 3;
- $now = date_i18n(‘U’);
- $entry = get_the_time(‘U’);
- $term = date(‘U’,($now – $entry)) / 3600;
- if( $time > $term ){
- echo ‘<span class=”nmark”>NEW</span>’;
- }
- ?>
上記のコードをloop-single-topic.phpの54行目付近にある
- <?php bbp_topic_title(); ?>
の前に貼り付けるとトピック一覧で新着マークを表示することができます。他のテーマなどで設置する場合もタイトルを表示している部分をさがして、その前に貼り付ければOKです。サンプルでは３時間の間、表示されます。時間を変更したい場合は$time = 3;の数字部分をしてください。3600という数字は1単位の秒数のことなので3600秒はつまり1時間ということになります。マークのデザインはcssで好みにカスタマイズすることができます。
cssサンプル
- .nmark{
- display: inline-block;
- padding: 5px;
- background: #005fff;
- color: #fff;
- vertical-align: middle;
- font-weight: 300;
- line-height: 1;
- font-size:10px;
- margin-right:5px;
- }
NEWこんな感じで表示できます。主にcolorで色、paddingで幅を調整できます。font-sizeで文字の大きさを変えることもできます。文字の高さがずれた場合はline-heightの数字を変えて調整しましょう。是非カスタマイズしてオリジナルの新着マークを作ってみてください。新着マークを表示することでで更新された記事ということがわかるようになり、再訪問率の向上につなげることができます。
実際にどうなったか
マークを表示したサイトでは表示前に比べて観覧数が上りました。またコメントで見やすくなった、分かりやすくなったなどの声も聞こえるようになりました。あわせて訪問前と訪問済みのリンクがすぐにわかるようにvisitedでテキストカラーも変わるようにしておくとより一層みやすいサイトに仕上がります。