2007-08-22

検索結果のページのデザインを修正(改行、記事タイトル一覧など)(Seesaa)

このブログでは左サイドバーの一番上にSeesaaで用意されている検索ボックスを設置しています。
この検索ボックスを使って表示される検索結果のページは、初期設定のままではデザインが少し見づらいものになってしまっていました。(例えば、改行が向こうになっていたり)
原因は、検索結果のページが記事コンテンツのHTMLではなくて全体のHTMLの方で指定されているからのようです。
そこで、全体のHTMLを少し書き変えて見やすくしてみました。

管理画面から[デザイン]→[HTML]と進んで、その中の一部分を書き変えます。

<% if:page_name eq 'search' -%>
<div class="sidetitle"><a href="<% blog.page_url %>">HOME</a> > 検索 :このページの記事一覧</div>
<div class="side">
<% loop:list_article -%>
<a href="<% article.page_url %>" class="a"><% article.subject %></a><br />
<% /loop -%>
</div>

<% loop:list_article %>
<div class="blog">

<h2 class="date"><% article.createstamp | date_format("%F") %></h2>
<div class="blogbody">

<h3 class="title"><a href="<% article.page_url %>" class="title"><% article.subject %></a></h3>
<div class="text"><% article.entire_body | text_summary(240) %></div>
<div class="text"><% if:article.convert_breaks %><% article.entire_body | nl2br %><% else %><% article.entire_body %><% /if %></div>
<div class="posted">
<% if:article.accept_comment_show -%>| <a href="<% article.page_url %>#comment">Comment(<% article.children_count | __or__ | echo('0') %>)</a><% /if -%>
<% if:article.accept_tb_show %>| <a href="<% article.page_url %>#trackback">TrackBack(<% article.tb_count | __or__ | echo('0') %>)</a><% /if -%>

</div>

</div>

</div>
<% /loop %>
<% unless:list_article %><div class="text">該当するページが見つかりませんでした。</div><% /unless %>
<% /if -%>

青い文字の部分を追加、赤い文字の部分を削除しました。

・検索結果の記事のタイトル一覧をページ上部に表示
・各記事の下部のposted欄にコメント、トラックバックを表示
・検索結果がゼロの場合は「該当するページが見つかりませんでした」と表示
・改行を有効にして、全文を表示

という感じで、違和感のあったデザインが改善されたと思います。
posted欄にカテゴリを表示することはできないみたいです。


HTMLの書き換えにあたっては、以下のページがたいへん参考になります。

検索結果ページのデザイン :ブログカスタマイズ
検索結果ページの改行 :ブログカスタマイズ
検索結果でヒット件数ゼロを表示する :ブログカスタマイズ

【追記】
現在は、当ブログ内の検索には「Google検索」を使っているので、上記のCSSの書き換えが反映される場面はありません。

この記事へのコメント
始めまして。

表示件数を全てではなく、5件ずつぐらいに分けて(タイトル一覧も同様に)表示させる事はできますか?

あと、続きを読むなどの追記記事がどうしても検索をかけると表示されてしまうのですが、これを改善する方法はあるのでしょうか。

Posted by もんた at 2011-06-20
コメントを書く
Name:

URL:

Comment:

認証コード:


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

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

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