カテゴリーの記事を一覧表示(Blogn版)

カテゴリーをクリックすると、カテゴリー内の記事一覧が表示されるようにスクリプトをカスタマイズしてみました。
nJOY BLOG」でどのように動いているか確認できます。
以下、目次

  1. 「index.php」書き換え Part1(表示件数)
  2. 「index.php」書き換え Part2(リンク)
  3. カテゴリ用スキン作成
  4. スキン適用
  5. 応用(月別表示)
  6. 制限事項

BlognPlus でのやり方は「カテゴリーの記事を一覧表示(BlognPlus版)」を参照してください。

説明

改造方法の前に簡単に仕組みを説明します。

ぶろぐんでは管理画面から1ページに表示する記事の数を指定できます(表示記事件数)。
この設定のせいで、すべての表示方法(初期表示/月別表示/カテゴリ別表示)において、5件なら5件ずつしか記事が表示されません。

今回の改造では、全表示方法に対して同じ件数しか表示されないという呪縛から、ユーザーを解き放ちます。これによって初期表示では5件、カテゴリ別表示では50件など、柔軟な表示を可能にします。
これにカテゴリ専用スキンを用意することで、カテゴリでは題名だけの一覧表示が出来るようになります。

Blogn(ぶろぐん)v1.9.2 の場合

1. 「index.php」を書き換える(表示件数を変更)

index.php 内に記述された LOGCOUNT という変数は、[ブログの初期設定] で指定した記事表示件数の値が挿入されます。


/* ----- ログ表示処理(カテゴリ別表示) ----- */
function category_log($skin, $qry_data, $qry_page) {
	if ($qry_page == "") $qry_page = 1;
	if (IKEY == 0) {
		$page_st = LOGCOUNT * ($qry_page - 1) + 1;
		$page_ed = $page_st + LOGCOUNT;
	}else{
		$page_st = IMCOUNT * ($qry_page - 1) + 1;
		$page_ed = $page_st + IMCOUNT;
	}

          …
          …
        (中 略)
          …
          …

	if (IKEY == 0) {
		$maxpage = ceil(($i - 1) / LOGCOUNT);
	}else{
		$maxpage = ceil(($i - 1) / IMCOUNT);
	}

1504行目、1505行目、1614行目の LOGCOUNT を任意の数字(n)に書き換えてください。
下記の例ではn=50 にしてみました。


/* ----- ログ表示処理(カテゴリ別表示) ----- */
function category_log($skin, $qry_data, $qry_page) {
	if ($qry_page == "") $qry_page = 1;
	if (IKEY == 0) {
		$page_st = 50 * ($qry_page - 1) + 1;
		$page_ed = $page_st + 50;
	}else{
		$page_st = IMCOUNT * ($qry_page - 1) + 1;
		$page_ed = $page_st + IMCOUNT;
	}

          …
          …
        (中 略)
          …
          …

	if (IKEY == 0) {
		$maxpage = ceil(($i - 1) / 50);
	}else{
		$maxpage = ceil(($i - 1) / IMCOUNT);
	}

これで [ブログの初期設定] に関係なく、カテゴリーをクリックすると、1ページあたり50件の記事が表示されるようになります。

改造スクリプトをアップロードし、改造が上手く行われたかテストするためカテゴリをクリックします。
もし「記事表示件数」よりも多くの記事がずらずらっと表示されていたら改造成功、次のステップへ進んでください。

2. 「index.php」を書き換える(題名にリンク)

1524〜1525行目

if ($page_st <= $i && $page_ed > $i) {
  $buf = str_replace ("{LOGTITLE}", $d_title, $tmpbuf);

新たに「$d_link」という変数を組み込みます。


if ($page_st <= $i && $page_ed > $i) {
  $d_link = "<a href=\"".PHP_SELF."?eid=".$eid."\">".$d_title."</a>";
  $buf = str_replace ("{LOGTITLE}", $d_link, $tmpbuf);

ここで何をしたかというと、オリジナルではスキンの {LOGTITLE} 部分に記事の題名を挿入していましたが、改造した結果 {LOGTITLE} に記事の題名+リンクが挿入されます。

改造スクリプトを再びアップロードし、改造が上手く行われたかテストするためカテゴリをクリックします。
もし記事の題名をクリックして、個別記事が表示されれば改造成功、次のステップへ。

3. カテゴリ別表示用のスキン作成

「記事表示件数」よりも多くの記事を一度に表示出来るようになりましたが、本文も一緒に表示されてしまいます。
題名だけ一覧表示するために、カテゴリ専用のスキンを作りましょう。

カテゴリ専用スキンを作るといっても、現在使用しているスキンをベースにするので作業量はたいした事はありません。
ここではぶろぐん同梱のスキン(0.html)を例に説明します。

ここから上はそのまま
  ↑
{SEARCH}
 (中略)
{/SEARCH}

{PROFILES}
 (中略)
{/PROFILES}

{LOGLOOP}
  <table border="0" cellspacing="0" cellpadding="0" width="100%">
    <tr>
      <td>
        <div class="entry_date">{LOGYMD}Y,m,d, l{/LOGYMD}</div>
        <div class="entry_title">{LOGTITLE}</div>
        <div class="entry_author" style="text-align:right;">
        author : {LOGAUTHOR}</div>
        <div class="entry_body">
        {LOGBODY}<br>
        <br>
        {MOREMARK}続き▽{/MOREMARK}
        {LOGMORE}
        </div>
        <div class="entry_state">
        {LOGCATEGORY} | {LOGHMS}h:i A{/LOGHMS} | {LOGCOMMENT} | {LOGTRACKBACK} |</div>
      </td>
    </tr>
  </table>
{/LOGLOOP}

{COMMENT}
 (中略)
{/COMMENT}

{TRACKBACK}
 (中略)
{/TRACKBACK}
  ↓
ここから下もそのまま

必要なのは記事の題名(と日付)だけなので、要らない部分(SEARCH, PROFILES, COMMENT, TRACKBACK, 他)を削除します。

ここから上はそのまま
  ↑
{SEARCH}
 (中略)
{/SEARCH}

{PROFILES}
 (中略)
{/PROFILES}

{LOGLOOP}
  <table border="0" cellspacing="0" cellpadding="0" width="100%">
    <tr>
      <td>
        <div class="entry_date">{LOGYMD}Y,m,d, l{/LOGYMD}</div>
        <div class="entry_title">{LOGTITLE}</div>
        <div class="entry_author" style="text-align:right;">
        author : {LOGAUTHOR}</div>
        <div class="entry_body">
        {LOGBODY}<br>
        <br>
        {MOREMARK}続き▽{/MOREMARK}
        {LOGMORE}
        </div>
        <div class="entry_state">
        {LOGCATEGORY} | {LOGHMS}h:i A{/LOGHMS} | {LOGCOMMENT} | {LOGTRACKBACK} |</div>
      </td>
    </tr>
  </table>
{/LOGLOOP}

{COMMENT}
 (中略)
{/COMMENT}

{TRACKBACK}
 (中略)
{/TRACKBACK}
  ↓
ここから下もそのまま

要らない部分を削除した結果(↓)

ここから上はそのまま
  ↑
{LOGLOOP}
  <table border="0" cellspacing="0" cellpadding="0" width="100%">
    <tr>
      <td>
        <div class="entry_date">{LOGYMD}Y,m,d, l{/LOGYMD}</div>
        <div class="entry_title">{LOGTITLE}</div>
      </td>
    </tr>
  </table>
{/LOGLOOP}
  ↓
ここから下もそのまま

スキンは人それぞれカスタマイズして使っているのであまり多くは語りません。

日付の表示が必要なければ {LOGYMD}〜{/LOGYMD} も削除してかまいません。
最低限 {LOGLOOP}{LOGTITLE}{/LOGLOOP} のような記述さえあれば OK です。
スタイルシートの適用は各自好みで。

新しいスキンが出来上がったら、ぶろぐん管理画面からスキンファイルと CSS ファイルを登録してください。

4. スキンの適用

ぶろぐん管理画面から [使用スキンの登録] 画面に入り、先ほど登録したスキンを適用します。

  1. 通常は「ノーマル表示」を選択していると思いますが、「ジャンル別表示」に切り替えます。
  2. 初期表示/サイト内検索表示/プロフィール表示/指定記事表示、そして月別表示はプルダウンメニューから今まで使っていたスキンを選んでください。
  3. 最後のカテゴリ別表示については、先ほど登録したカテゴリ表示専用スキンを選んでください。
  4. 最後にページ最下部の [スキンを登録する] を押して作業完了です。

スキンの適用が終わったら、自分のブログのカテゴリを確認します。
本文なしで題名(+日付)だけが表示されていたら、一覧表示の改造は成功です。

5. 月別表示にも応用

月別表示も同じように一覧表示させたい場合は、1256行目、1257行目、1363行目の LOGCOUNT を任意の数字に書き換えてください。
また 1275〜1276行目に「ステップ2」で行った事をやってください。
スキンはカテゴリ用で作成した物が流用出来ます。[使用スキンの登録] で月別表示に同じスキンを登録すれば完了です。

6. 制限事項

必ず全カテゴリに対して、作成したカテゴリ専用スキンを登録してください。
登録しなかった場合、そのカテゴリをクリックすると最高 n の数だけ記事+本文が表示され、かなりファイルサイズが重くなる事が予想されます。
新しくカテゴリを作成したら、忘れずにスキンを登録しましょう。


サイト作成のヒント集に戻る