Top Blog parts , customize ;>カテゴリ(過去ログ)記事一覧表示

2006年07月05日

カテゴリ(過去ログ)記事一覧表示

前々からこの機能を付けたいなぁ・・・と思っていましたが、勢いでやってしまいました。
と言っても、いつものように先駆者さんの真似なんですけどね。(^_^;)

カテゴリ一覧
カテゴリーページを開くとこんな風に表示されます
カテゴリ(Category)ページトップにこんな風なものが表示されます。
これは、Blog parts , customizeを開いたときの表示例です。


seesaaブログでの設定方法

※事前に記事コンテンツを4つ(トップページ、記事ページ、過去ログページ、カテゴリページ)にしておいたほうが良いのかなぁ・・・私の場合は、Google AdSense対応で4つにしておきました。

・デザイン - コンテンツ - 記事(カテゴリページ)
・コンテンツHTMLの編集
 (編集前に作業前のHTMLをバックアップしておきます)
・赤字のところを追加
<% /if -%>
<% if:page_name eq 'category' -%>
<div class="navi">
<a href="<% blog.page_url %>">TOP</a> / <% category.name %>
</div>
<% if:pager.need_pager -%>
<div class="navi">
<% if:pager.previous_page %><a href="<% category.page_url(pager.previous_page) %>"><% /if %><<<% if:pager.previous_page %></a><% /if %><% loop:list_pager %> <% if:current_page ne pager_number %><a href="<% category.page_url(pager_number)%>"><% /if %><% pager_number %><% if:current_page ne pager_number %></a> <% /if %><% /loop %><% if:pager.next_page %><a href="<% category.page_url(pager.next_page) %>"><% /if %>>><% if:pager.next_page %></a><% /if %>
</div>
<% /if -%>

<div id="clist">
<script langage="JavaScript">
<!--
<% if:pager.need_pager -%>
var start=1+<% blog.category_page_cnt %>*(<% current_page %>-1);
var end=<% if:pager.next_page %><% blog.category_page_cnt %>*<% current_page %><% else %><% category.article_count %><% /if %>;
document.write("「<% category.name %>」カテゴリの<% category.article_count %>件中",start,"-",end,"件の記事一覧です。");
<% else -%>
document.write("「<% category.name %>」カテゴリの記事一覧です。");
<% /if -%>
// -->
</script>
<ul>
<% loop:list_article -%>
<li><a href="<% article.page_url %>" class="a"><% article.subject %></a></li>
<% /loop -%>
</ul>
</div>


<% /if -%>

<% loop:list_article -%>
・CSS修正
 (編集前に作業前のHTMLをバックアップしておきます)
・赤字のところを追加
 (一番下で良いと思います)
/* カテゴリ記事リスト */
#clist {
text-align:left;
background:#FEFFF0;
margin: 20px;
padding: 10px;
border: 3px double #B2B2B2;
font-size: 90%;
}
#clist li {
margin-bottom: 0.6em;
font-size: 90%;
font-weight:normal;
line-height:150%;
}
・再構築

作業前に、変更するHTMLとCSSのバックアップを忘れずにしておきましょう。
忘れると、痛い目にあうかもしれませんよ。



過去ログページもカテゴリーページと同様です。

過去ログ一覧
過去ログページを開くとこんな風に表示されます
過去ログ(Archive)ページトップにこんな風なものが表示されます。
これは、2006年6月を開いたときの表示例です。

・デザイン - コンテンツ - 記事(過去ログページ)
・コンテンツHTMLの編集
 (編集前に作業前のHTMLをバックアップしておきます)
・赤字のところを追加
<% if:archive_page_name eq 'month' -%>
<% if:pager.need_pager -%>
<div class="navi">
<% if:pager.previous_page %><a href="<% archive.page_url(pager.previous_page) %>"><% /if %><<<% if:pager.previous_page %></a><% /if %><% loop:list_pager %> <% if:current_page ne pager_number %><a href="<% archive.page_url(pager_number)%>"><% /if %><% pager_number %><% if:current_page ne pager_number %></a><% /if %> <% /loop %><% if:pager.next_page %><a href="<% archive.page_url(pager.next_page) %>"><% /if %>>><% if:pager.next_page %></a><% /if %>
</div>
<% /if -%>

<div id="clist">
<script langage="JavaScript">
<!--
<% if:pager.need_pager -%>
var start=1+<% blog.archives_page_cnt %>*(<% current_page %>-1);
var end=<% if:pager.next_page %><% blog.archives_page_cnt %>*<% current_page %><% else %><% archive.article_count %><% /if %>;
document.write("<% archive.createstamp | date_format("%Y年%m月") %>の<% archive.article_count %>件中",start,"-",end,"件の記事一覧です。");
<% else -%>
document.write("<% archive.createstamp | date_format("%Y年%m月") %>の記事一覧です。");
<% /if -%>
// -->
</script>
<ul>
<% loop:list_article -%>
<li><a href="<% article.page_url %>" class="a"><% article.subject %></a></li>
<% /loop -%>
</ul>
</div>


<% /if -%>

<% /if -%>
<% if:page_name eq 'category' -%>
・再構築

作業前に、変更するHTMLとCSSのバックアップを忘れずにしておきましょう。
忘れると、痛い目にあうかもしれませんよ。


これで、過去ログやカテゴリーページへのアクセスがしやすくなるのかなぁ・・・
結局のところ、この手のカスタマイズって自己満足なんですけどね。(^_^;)

■HTML編集して記事ページの下に「google AdSense」を載せる方法 - 副業でアフィリエイトするなら無料Seesaaブログでしょ!
TB
Seesaaブログで件数表示を伴うカテゴリ・過去ログ別記事一覧表示 - 徒然なるままに
カテゴリで記事一覧を表示する [HTML+CSS] - Seesaa デザインテンプレート







posted by しばやん at 21:12 | Comment(4) | TrackBack(2) | Blog parts , customize このエントリーを含むはてなブックマーク
この記事へのコメント
いや〜
難しそうですね?
HTMLが出てくるともうお手上げです・・・。
でも面白そう!でも出来ない!(くやしいです)

巡回先Blogありがとうございま〜す。
さっそく私のBlogでも同じように貼れるのか、やってみま〜す。

ではまた・・・。
Posted by カド at 2006年07月06日 10:57
いやぁ・・・
カドさん反応してくれましたねぇ。
この手のカスタマイズネタを投稿する時ってカドさん反応するかなっていつも思っていました。
コメントもらえて嬉しいです。\(^o^)/

アルファベットの羅列を見ると、難しそうに見えますが、意外と簡単に出来ますよ。
ただ、些細なミスがとんでもない事になる可能性があるので、バックアップ(テキストデータにコピーで良いですよ)を取るのをお忘れなく!

どうでしょう。
過去ログやカテゴリーページが見やすくなったでしょうか?
自己満足だとは思いながらも他の方の反応が気になります。
Posted by しばやん at 2006年07月06日 16:19
初めまして!!
参考にさせて頂きました。
というよりも、ほぼまんまです。
芸の無いヤツと笑って許して下さい。
ありがとうございました。
Posted by れのじ at 2007年12月07日 23:18
>れのじさん
お役に立てた用で光栄です。
私も先駆者さんのマネをしたわけで・・・(ノ▽ ̄〃)ヘヘヘ
Posted by しばやん at 2007年12月08日 20:09
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック

HTMLとCSS修正でちょっと機能を追加♪
Excerpt: 今日がブログ開設一周年となりましたが、昨日からもくもくとやっていたのが、ちょっとしたHTMLとCSSの修正です&amp;#63903; 参考サイトさんに詳しく書いてあるから、適切な場所にコピペしてC..
Weblog: マキノハラENJOYブログ(*´▽)_旦~~
Tracked: 2007-03-04 13:45

記事一覧をつけました。
Excerpt: ご記事のとおりに修正し、一覧をつけました。ありがとうございました。
Weblog: up-too-late
Tracked: 2008-08-14 00:33
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。